Horizontal Nav-bar problem. Options

[Maccabee]

Here is my CSS:

CODE

div#navbar2 {
width:800px;
}

div#navbar2 ul {
margin: 0px;
padding: 0px;
line-height: 30px;
white-space: nowrap;
}

div#navbar2 li {
list-style-type: none;
display: inline;
}

div#navbar2 li a.nav:link, a.nav:active, a.nav:visited {
background-image: url(/design-images/link.gif);
width: 100px;
height: 30px;
display:block;
color: #FFFFFF;
text-align: center;
text-decoration: none;
font-size: 10px;
font-style: italic;
line-height: 23px;
}

div#navbar2 li a.nav:hover {
background-image: url(/design-images/hover.gif);
width: 100px;
height: 30px;
display:block;
color: #FFFFFF;
}

And here is my HTML:

CODE

<div id="navbar2">
<ul>
<li><a class="nav" href="http://www.wefuze.com/">Home</a></li>
<li><a class="nav" href="/contact/">Contact</a></li>
<li><a class="nav" href="/photoshop-tutorials/">Photoshop Tutorials</a></li>
<li><a class="nav" href="/image-hosting/">Image Upload</a></li>
<li><a class="nav" href="/anonymous-email">Anonymous E-mail</a></li>
</ul>
</div>

Everything works fine but because the links blocks (display:block) The links are stacking on top of eachother! And I want them to be side by side.

The reason the links are blocks is because they have to 100x30.

Cause thats how big the background is. So is there away to make the link 100x30 but not have the display:block;?

[allvanishing]

CODE

div#navbar2 {
width:800px;
}

div#navbar2 ul {
margin: 0px;
padding: 0px;
line-height: 30px;
white-space: nowrap;
}

div#navbar2 li {
list-style-type: none;
display: inline;
}

div#navbar2 li a.nav:link, a.nav:active, a.nav:visited {
background-image: url(/design-images/link.gif);
width: 100px;
height: 30px;
display:block;
float: left;
color: #FFFFFF;
text-align: center;
text-decoration: none;
font-size: 10px;
font-style: italic;
line-height: 23px;
}

div#navbar2 li a.nav:hover {
background-image: url(/design-images/hover.gif);
width: 100px;
height: 30px;
display:block;
color: #FFFFFF;
}

Just add a float: left and it should work.

[Maccabee]

Ugghhh...It works but since since its folating its floating to the left. So its going to the left of all the content and the container.

I wish there was like a float center top. haha