horizontal listing using <ul> <li>

[soianyc]

I need to make a horizontal list for a main page display that i have. It would entail two rows of 3 boxes each holding a dynamically created object. What i want to do is everytime there is data i want to display it in a box that gets created automatically. Ill show you my code and tell you where im stuck at.
I cant make the list go horizontally.
here is the code


#itempic{
margin:0;
padding-top: 3px;
padding-bottom: 1px;
width: 180px;
height: 200px;
border-left: 1px solid gray;
border-top: 1px solid gray;
text-align: center;
background-color: white;
}

#itemlist{
position:absolute;
top: 120px;
left: 165px;
margin: 0;
padding: 0;
width: 600px;
list-style: none;
background: white;
color: black;
}

#itemlist ul{
display: inline;
}



and here is the tags in my html


<ul id="itemlist">
<li id="itempic">yes</li>
<li id="itempic">hello</li>

</ul>


Thanks for your help

[_Aerospace_Eng_]

You can't use an id more than once, if you want to use the same css over for another element you need to make a class. To get the li's to move next to each other you need to float the li's. Use this for your CSS
.itempic{
margin:0;
padding-top: 3px;
padding-bottom: 1px;
width: 180px;
height: 200px;
border-left: 1px solid gray;
border-top: 1px solid gray;
text-align: center;
background-color: white;
float:left;
}

#itemlist{
position:absolute;
top: 120px;
left: 165px;
margin: 0;
padding: 0;
width: 600px;
list-style: none;
background: white;
color: black;
}

Use this for your html
<ul id="itemlist">
<li class="itempic">yes</li>
<li class="itempic">hello</li>
</ul>

[soianyc]

Awesome thanks a lot