I have multiple divs floated to the left within another div. Now when those divs are wider together than the div they are in they go to the next line, instead of making a horizontal scrollbar like I wanted it!
My CSS for my divs:
outer div:
display:block;
border-width:1px;
border-style:solid;
border-color:black;
margin-left:auto;
margin-right:auto;
height:20px;
width:200px;
overflow:auto;
inner divs:
min-width:16px; //contains text, so it gets wider usually
float:left;
padding-left:2px;
padding-right:2px;
Add overflow-x: scroll to the outerdiv. FYI: The overflow-x property does not work properly in IE8 and earlier. So if you need it to work in IE8 or earlier, you’ll likely need a javascript solution.