HTML
- <ul id="OCSSM_Horizontal-orange-classic">
- <li><a href="#" title="Horizontal Css Menu">Horizontal Css Menu</a></li>
- <li><a href="#" title="Css Menu">Css Menu</a></li>
- <li><a href="#" title="Only Css Menu">Only Css Menu</a></li>
- <li><a href="#" title="Css Menu">Css Menu</a></li>
- </ul>
CSS
- <style>
- #OCSSM_Horizontal-orange-classic {
- margin:0;
- padding:0px;
- list-style:none;
- background:url(images/horizontal_d_orange_classic_bg.gif) repeat-x top;
- height:29px;
- width:99%;
- border:solid 1px #c93300;
- border-width:1px 1px 1px 0;
- }
- #OCSSM_Horizontal-orange-classic li {
- display:inline;
- position:relative;
- float:left;
- }
- #OCSSM_Horizontal-orange-classic li a {
- display:block;
- float:left;
- height:29px;
- line-height:29px;
- padding:0 25px;
- text-decoration:none;
- color:#FFFFFF;
- font-weight:normal;
- font-size:12px;
- border-left:solid 1px #c93300;
- }
- #OCSSM_Horizontal-orange-classic li a:hover {
- color:#a9401b;
- background:#FFFFFF;
- }
- </style>
Browser Compatability
- FireFox
- IE7
- Safari
- Opera
