Hi Everybody,
Hi there! I just have a question to you css experts. I'm trying to make a horizontal navigation from UL. I also added a background image which I have attached. My problem is how to use "ul#navlist li a:hover" style on my sixth LI that doesn't have a hyperlink. I want it to stay inline with the other LI also. I have tried experimenting but I didn't have any luck. I'm testing the result in IE, Opera and FF. Please see the CSS stylesheet and html code below. Thank you!
sincerely,
Lala, Philippines
-----------------
<style type="text/css">
ul#navlist {
padding:0;
margin:0;
width: 100%;
}
ul#navlist li {
display:inline;
}
ul#navlist li a{
float:left;
width:7em;
color: #fff;
background-color: green;
padding: 0.2em 1em;
text-decoration: none;
border-right: 1px solid #FFFFFF;
font-family:verdana,arial,sans-serif;
font-size:11px;
line-height:22px;
font-weight:bold;
background-image: url(images/nav.jpg);
text-align: center;
}
ul#navlist li a:hover
{background-color:lime;
background:url(images/nav_hl.jpg);
color:#006600;
}
p
{
display:inline;
width:7em;
color: green;
background-color: green;
padding: 0.2em 1em;
text-decoration: none;
border-right: 1px solid #FFFFFF;
font-family:verdana,arial,sans-serif;
font-size:11px;
line-height:22px;
font-weight:bold;
background-image: url(images/nav_hl.jpg);
text-align: center;
}
</style>
<table >
<tr>
<td>
<ul id="navlist">
<li><a href="#">Milk</a></li>
<li><a href="#">Eggs</a></li>
<li><a href="#">Cheese</a></li>
<li><a href="#">Vegetables</a></li>
<li><a href="#">Fruit</a></li>
<li>TEST</li>
</ul>
</ul></td>
</tr>
</table>
---------
--
Using Opera's revolutionary e-mail client: http://www.opera.com/mail/
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************
<<attachment: nav.jpg>>
<<attachment: nav_hl.jpg>>
