Div with constant height variable width

Question

There is a Div of width say 500px and height 50px. Inside this Div there are many (say 50) small Div of width 50px and height 50 px. Now i want a horizontal scroll instead of a vertical one. How can i force those small divs to overflow horizontally not vertically

Also number of small divs can change.

Answer 1

Assign the following CSS to the outer DIV :

white-space: nowrap;
overflow-x: scroll;

See an example at this fiddle .

Answer 2

Try setting the child div's to display: inline-block , then set the parent to white-space: nowrap .

Hope that helps :)

Answer 3

the main div style define

 float : left; 
 overflow : scroll;