2009-05-15

Image

Free Css/Html Horizontal Menu



This is a simple light dynamic Css/Html vertical menu with a light gradient and a border that you can use on your site. . . this menu is a cross browser complaint (Mozilla, IE6, IE7, Safari).  And Here you can see the DEMO .  And also you can See and download the images here.

CSS code:
ul#hmenu {
margin:0;
padding:0;
list-style:none;
overflow:hidden;
width:900px;
height:40px;
background:url(images/HM_bg.jpg) repeat-x;
}
ul#hmenu li {
float:left;
background:url(images/HM_border.jpg) right no-repeat;
padding:0 2px 0 0;
}
ul#hmenu li a {
display:block;
padding:0 28px 0 30px;
height:40px;
width:auto;
font:bold 14px Arial, Helvetica, sans-serif;;
color:#FFFFFF;
text-decoration:none;
float:left;
line-height:40px;
}
ul#hmenu li a:hover {
background:url(images/HM_bg_hover.jpg) repeat-x;
}
HTML code:
<ul id=”hmenu”>
<li><a href=”#”>Home</a></li>
<li><a href=”#”>About</a></li>
<li><a href=”#”>Privacy</a></li>
<li><a href=”#”>Contact Us</a></li>
</ul>

التعليقات:

Total Pageviews