Question

i am not able to explain it correctly….but here it is….i want DIVs to float left in the container such that…when their total width increases the width of the container…they will make a horizontal scroll-bar but will not go below one another in any case…
like if the container’s width is 500px;
and it contains 5 children DIVs each of 200px width
now when i float then left…they stack like 2 in a row and 2 in the next row….eg:
div1 div2
div3 div4
div5
i want them something like this :
div1 div2 div3 div4 div5
with scroll-bar…

Answer 1

I would recommend, instead of floating them, set display:inline-block;, then apply white-space:nowrap to the container element.

And be sure the container has no fixed width. (min-width is OK though).

update
1) fixed error (thanks to JOPLOmacedo)
2) working example at: http://jsfiddle.net/t9Vnf/