Menuen vises ikke korrekt i FF!
Hej...Jeg har lavet en menu i HTML og CSS.
Den ser ud som den skal i IE6, men FF ser den helt anderledes ud.
Nogle der kan fortælle mig hvad jeg har gjort galt?
Her er koden:
<html>
<head>
<title>menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.book {
font-family: Verdana;
font-size: 11px;
font-weight: normal;
color: #336699;
list-style-type: square;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #CCCCCC;
}
.book a:link {
color: #336699;
text-decoration: none;
}
.book a:visited {
text-decoration: none;
color: #336699;
}
.book a:hover {
text-decoration: none;
color: #336699;
}
.book a:active {
text-decoration: none;
color: #454545;
}
.ag {
font-family: Verdana;
font-size: 11px;
font-weight: normal;
color: #32734B;
list-style-type: square;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #CCCCCC;
}
.ag a:link {
color: #32734B;
text-decoration: none;
}
.ag a:visited {
text-decoration: none;
color: #32734B;
}
.ag a:hover {
text-decoration: none;
color: #32734B;
}
.ag a:active {
text-decoration: none;
color: #454545;
}
.news {
font-family: Verdana;
font-size: 11px;
font-weight: normal;
color: #CC3333;
list-style-type: square;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #CCCCCC;
}
.news a:link {
color: #CC3333;
text-decoration: none;
}
.news a:visited {
text-decoration: none;
color: #CC3333;
}
.news a:hover {
text-decoration: none;
color: #CC3333;
}
.news a:active {
text-decoration: none;
color: #454545;
}
-->
</style>
</head>
<body>
<div id="book_head" style="position:absolute; top:10px; left:50px"><img src="empty.gif" alt="" width="160" height="40"></div>
<div id="x1" style="position: absolute; top:45px; left:40px; padding-top:10px; padding-bottom:10px">
<ul>
<li class="book"><a href="#">xxxxxx</a></li>
<li class="book"><a href="#">xxxxxx</a></li>
<li class="book"><a href="#">xxxxxx</a></li>
<li class="book"><a href="#">xxxxxx</a></li>
<li class="book"><a href="#">xxxxxx</a></li>
<li class="book"><a href="#">xxxxxx</a></li>
</ul>
</div>
<div id="ag_head" style="position:absolute; top:200px; left:50px"><img src="empty.gif" alt=""></div>
<div id="x2" style="position: absolute; left: 40px; top: 235px; padding-top: 10px; padding-bottom: 10px">
<ul>
<li class="ag"><a href="#">xxxxxx</a></li>
<li class="ag"><a href="#">xxxxxx</a></li>
<li class="ag"><a href="#">xxxxxx</a></li>
<li class="ag"><a href="#">xxxxxx</a></li>
<li class="ag"><a href="#">xxxxxx</a></li>
</ul>
</div>
<div id="x3" style="position:absolute; top:370px; left:50px"><a href="#"><img src="empty.gif" alt="" border="0"></a></div>
<div id="news" style="position:absolute; top:415px; left:40px">
<ul>
<li class="news"><a href="#">xxxxxx </a></li>
<li class="news"><a href="#">xxxxxx</a></li>
</ul>
</div>
</body>
</html>