Hey, I have code similar to the following (it's a jQuery-like slider hence the overflow hidden and odd widths): <div style="width: 1000px; overflow: hidden;"> <ul style="width: 5000px;"> <li>0</li> <li>1</li> <li>2</li> </ul> </div> HTML: Which is fine. All the list items have float left and have a set width. If you take a look at the below image it demonstrates what I want to achieve. The top image is how it current displays and the bottom is how I want it to display. Adding a 'clear: left;' is no good as then 5/6/7/8 (see diagram) display below and not inline with the boxes on the left. I can add classes to specific LIs if required. Thanks!
You can add additional div inside the main one and after that set its (additional one) width to 5000. Inside the additional div set three or more lists. Every list should have float left. So basically you are doing a list for every four elements. Every list can have same class with parameters like width, padding and etc.