Re: How to make horizontal scrolling content with CSS

[Mottie]

Hi Madcore!

All that’s missing is setting the width of the UL to fit all of the list items. Sadly setting it to 100% won’t work. Check out this demo.

ul {

width: 1500px; /* combined width of all LI's */

height: 200px;

margin: 0;

padding: 0;

}

li {

float: left;

}

Edit: Oh I just realized you probably don’t want it to scroll off the page. So just wrap the UL in a div that has whatever dimensions you want, with overflow set as follows (demo #2)

overflow-x: scroll;

overflow-y: hidden;