Css Help - Urgent

[SEÑOR]

SO I am having this problem with a layout I am coding. I have a nav that needs to be inline, but each link has an image background. For the image to appear, I need to put display: block. but then that crosses out the inline. SO I put inline-block and it works in ff but not IE. Can anyone help?

Code:
#top #nav {
width: 513px;
height: 33px;
}

#nav ul {
list-style-type: none;
margin-top: 0;
padding: 0;
text-align: center;
}

#nav ul li {
display: inline-block;
}

#nav ul li a {
background: url(images/nav.gif) repeat-x;
width: 72px;
height: 32px;
display: block;
text-decoration: none;
font-family: Arial;
font-size: 0.8em;
font-weight: bold;
color: #ffffff;
padding-top: 5px;
}

 

[Jober68]

have you tried to put the blocks inside of the inline using html? Put the blocks in as a class and the inline as an ID then don't put a div tag in after you inline until you finish with all of your blocks

 

[SEÑOR]

Then I can't do hover?

Html:
<div id="nav">
<ul>
<li><a href="index.php">Home</a></li>
<li><a href="/community">Community</a></li>
<li><a href="/swauz">Swauz</a></li>
<li><a href="/VIP">VIP</a></li>
<li><a href="/help">Help</a></li>
</ul>
</div>

 

[orthiac]

Have you tried:

<style type="text/css">
<!--
a.gotHover:hover {
	color: #FF0000;
}
-->
</style>

<div id="nav">
<ul>
<li><a class="gotHover" href="index.php">Home</a></li>
<li><a class="gotHover" href="/community">Community</a></li>
<li><a class="gotHover" href="/swauz">Swauz</a></li>
<li><a class="gotHover" href="/VIP">VIP</a></li>
<li><a class="gotHover" href="/help">Help</a></li>
</ul>
</div>

or whatever you want to do with your hover...

 

[Jober68]

You should still be able to set the Hover up just like normal unless you want it to be different for those in which case do as orthiac showed above.

 

[easykey]

Not sure if its what you want but have you checked this out?

csshover.htc

I used it for something similar - you can code for proper browsers and then add 'behaviour: url(csshover.htc);' in the body section of your css to fix it for IE. Works fine for me and your code will be ready for when IE starts conforming to standards...