Div menu issue please help me. [Archive]

javed951

06-05-2008, 09:27 AM

Hi all,

I make div base menu in css, but i have a problem, problem is that when i put this menu in my web page in IE are look better but in Mozilla mix with below div i can understand why it happened. Detail here for my menu.

<html>
<head>
<title>..Menu..</title>
<style type="text/css">

.tab-menu{
padding: 0;
width: 100%;
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;
}

.tab-menu ul{
font: bold 11px Arial;
margin:0;
margin-left: 40px;
padding: 0;
list-style: none;
}

.tab-menu li{
display: inline;
margin: 0 2px 0 0;
padding: 0;

}

.tab-menu a{
float: left;
display: block;
color: white;
margin: 0 1px 0 0;
padding: 5px 10px;
text-decoration: none;
letter-spacing: 1px;
background-color: black;
border-bottom: 1px solid white;
}

.tab-menu a:hover{
background-color: #D25A0B;
border-color: #D25A0B;
}

.tab-menuline{
clear: both;
padding: 0;
width: 100%;
height: 2px;
line-height: 2px;
background: #D25A0B;
}

</style>

</head>

<body>
<div class="tab-menu">
<ul>
<li><a href="#">Personal</a></li>
<li><a href="#">Professional</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Tools</a></li>
<li><a href="#">Forums</a></li>
</ul>
</div>

<div class="tab-menuline"> </div>
</body>
</html>