Rollover horizontal list navbar

 

HTML:

<ul id="navigation">
<li><a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="#">Products</a></li>
</ul>

CSS:

 
#navigation {
	padding: 10px ;
	margin-left: 0px;
	background-color: #036;
	color: #fff;
}

#navigation li {
	display:inline;	
}

#navigation li a{
	padding: 10px;
	color: #fff;
	background-color: #036;
	text-decoration:none;
}

#navigation a:hover
{
	background-color: #369;
}