I did a little mor elooking around, and I found the following means of
achiving what I am after.
Here does:
CSS CODE
#navcontainer ul
{
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}
#navcontainer ul li { display: inline; }
#navcontainer ul li a
{
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #036;
}
#navcontainer ul li a:hover
{
color: #fff;
background-color: #369;
}
HTML CODE
<div id="navcontainer">
<ul>
<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>
</ul>
</div>
The above works perfectly, but I am still a little unsure on how to
set an image as the background of the list items.
I need this image
(http://www.chiefcodemonkey.com/awbn/images/button_07.gif) as the
background to each of the list items, so that the list finally looks
likes this (http://www.chiefcodemonkey.com/awbn/images/sprite.gif)
[disregard the lighter green background colour. that is fr
demonstration only].
Christian, anyone else? Are you able to she some advice or lend a hand?
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
