Code
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Style type = "text/CSS">
Body {font-family: verdana, Arial, sans-serif; font-size: 12px; margin: 10px auto; text-align: center ;}
# Navigation {display: inline-block; padding: 20px; Border: 1px solid red ;}
Ul {margin: 0; padding: 0; List-style: none ;}
# Navigation Li {Height: 30px; float: Left ;}
# Navigation Li a {float: Left; Height: 30px; line-Height: 30px; padding: 0 23px; Background: #97c099; text-Decoration: none ;}
# Navigation Li A: hover {Background: #59c099; color: # FFF ;}
</Style>
<! -- [If lte ie 7]> <style type = "text/CSS"> # navigation {display: inline;} </style> <! [Endif] -->
<Title> float menu rules </title>
</Head>
<Body>
<Ul id = "navigation">
<Li> <a href = "#"> home </a> </LI>
<Li> <a href = "#"> News </a> </LI>
<Li> <a href = "#"> store </a> </LI>
<Li> <a href = "#"> group </a> </LI>
<Li> <a href = "#"> community </a> </LI>
<Li> <a href = "#"> help </a> </LI>
<Li> <a href = "#"> Home </a> </LI>
<Li> <a href = "#"> News </a> </LI>
</Ul>
</Body>
</Html>
