I need the following li to stack against each other in a horizontal fashion like so:
*li1 *li2 *li3
instead of:
* li * li * li Pretty much the li elements would be aligned like a gallery with the lis to the right being hidden and scrolled as needed.
Here is the JSFiddle
li be display: inline-block so they'll stack next to each otherwhite-space: nowrap on the ul so the li elements will stay on one line in its narrow containerYou need to make the li elements be display:inline-block and their container to be white-space:nowrap
Demo at http://jsfiddle.net/RnXDF/1/
<ul id="list"> <li></li> <li></li> <li></li> </ul> the css to accomplish what you want is
#list li{display:inline-block} 
remove the width in .comments and then add display:inline-block to .comments li , It wasn't working because you are restraining the width of the list causing that when you try to display it horizontally there is not enough space to place it the
