Geek asks and answers

Stop floating HTML elements from going to the next line

I am creating a website that is designed to display the dynamic number of div elements (each with its own width), but instead of going down the page, they go horizontally. However, when the number of combined widths of the elements is greater than the div container, it automatically drops to the next line. In any case, to stop this and allow horizontal scrolling (script, not overflow panel)?

+3
source share
1 answer

Instead of swimming, set them to display:inline-block;. Set the contained element to overflow:hidden;, and then you can use the script to scroll them using any number of means, for example, to adjust the field for the first element or to transfer them to another element and change the attribute left(you need to set positionif you go this route).

Edit: you also need to install white-space:nowrap

See this working script: http://jsfiddle.net/D8bea/

+11
source

More articles:


All Articles