Dear all,
I am here our of desperation, having RTFM'd and hacked for hours.
What I want is simple.
I want a left to right scrollable div, containing other divs.
Eg.
<div id="outerdiv" width="400px" height="100px" style="overflow-x:scroll">
<div class="innerdiv" width="100px">bar</div>
<div class="innerdiv" width="100px">bar</div>
<div class="innerdiv" width="100px">bar</div>
<div class="innerdiv" width="100px">bar</div>
<div class="innerdiv" width="100px">bar</div>
</div>
So that I can scroll along, left to right, and view the divs within. A
bit like the Apple Store.
No matter what I try, the inner divs stack up on top of one another. I
have tried float:left and float:right. This puts them in a row, but when
the total width exceeds the width of the containing div, it creates a
new row, rather than activating the scrollbar and allowing scrolling.
I would be very grateful for some help here, or even a workaround.