Displaying a unordered list horizontally

Question

I have a unordered list of images and I need to display them horizontally in a row with no margin/padding or list styling, what CSS would I use to do this?

Here is my html code:

<div id="carouselContainer">
    <ul id="carousel-list">
        <li><a href="/"><img src="image.png" alt="Desc" /></a></li>
        <li><a href="/"><img src="image.png" alt="Desc" /></a></li>
        <li><a href="/"><img src="image.png" alt="Desc" /></a></li>
        <li><a href="/"><img src="image.png" alt="Desc" /></a></li>
    </ul>
</div>

Any help with this would be great

Answer 1

Setting the float to left will make the list horizontally

li {
    float: left;
}

Answer 2

Add the following CSS.

 #carousel-list{padding:0;margin:0;}
 #carousel-list li{display:inline-block;}

DEMO

Answer 3

Try this

FIDDLE DEMO

#carousel-list {
    display: inline;
    list-style-type: none;
    padding:0;
    margin:0;
}

Answer 4

#carousel-list li
{
    display: inline-block;
}

#carousel-list
{
    list-style-type: none;
}

but google is faster

Answer 5

what about CSS:

ul, li {
  margin: 0;
  padding: 0;
  list-style:none;
}

li {
  display: inline;
}