The code below works fine in IE7 and Firefox but acts weird in IE6, cud any one help me on this...
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
body {
background-color:#000000;
margin: 0;
padding: 0;
}
.one {
background-color:#00FF00;
padding-left:.25em;
line-height:25px;
}
.two {
background-color:#3366CC;
padding-left:.25em;
line-height:25px;
}
.three {
background-color:#CC9900;
padding-left:.25em;
line-height:25px;
}
.four {
background-color:#CC3300;
padding-left:.25em;
line-height:25px;
}
.five {
background-color:#999999;
padding-left:.25em;
line-height:25px;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
display:block;
}
li {
margin:0;
padding:0;
display:block;
}
li a:link {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:8.5pt;
color:#FFFFFF;
text-decoration:none;
/*line-height:25px;*/
}
li a:hover {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:8.5pt;
color:#fff;
text-decoration:none;
display:block;
background-color:#666666;
/*line-height:25px;*/
}
</style>
</head>
<body>
<div id="pop">
<ul>
<li id="aa" class="one"><a href="#">Item one</a></li>
<li id="ab" class="two"><a href="#">Item two</a></li>
<li id="ac" class="three"><a href="#">Item three</a></li>
<li id="ad" class="four"><a href="#">Item four</a></li>
<li id="ae" class="five"><a href="#">Item five</a></li>
</ul>
</div>
</body>
</html>
