Category Archives: Horizontal css Menu

css Attractive Horizontal Menu

html/xhtml

<ul>
 <li><a href="#">Home</a></li>
 <li><a href="#">Profile</a></li>
 <li><a href="#">Mision</a></li>
 <li><a href="#">Vision</a></li>
 <li><a href="#">Forum</a></li>
</ul>

css

*{margin:0;padding:0;}
ul{
 margin:0;
 list-style:none;
}
ul li{
 float:left;
 width:100px;
 border:3px solid #FF0000;
 padding:5px;
 margin:0px 5px;

}
ul li a{
 border:3px solid #990033;
 padding:5px;
 display:block;
 color:#000000;
 text-decoration:none;
 text-align:center;
}
ul li:hover{
 border:3px solid #990033;
}

ul li a:hover{
 border:3px solid #FF0000;
 Vertical-align:
}

Advertisements