Trosku som sa na to pozrel a prvy problem, preco ti to nejde, je odlisny doctype... skus si tam dat presne ten zo stranky a aspon ciastocne ti to pojde...
Pre IE6/7 som ti menu odladil, zvysok si hadam dorobis aj sam
Ako som pozeral tvoj zdrojak, miesas spolu px a em, to by sa nemalo, bud si vyber jedno alebo druhe... vychadzal som z tvojho zdrojaku, takze som to tak nechal aj v nasledujucom kode:
CSS:
Kód:
* { margin:0; padding:0; font-size: small; font-family: arial, helvetica, sans-serif; }
#menuh a:link, #menuh a:visited, #menuh a:active { color: white; background-color: #222222; text-decoration:none; }
#menuh a { text-align: center; display:block; border: 1px solid #555; white-space:nowrap; padding:4px 0 5px 0; }
#menuh a:hover { color: white; background-color: darkorange; text-decoration:none; }
#menuh a.top_parent, #menuh a.top_parent:hover { background: url("vseobTla.jpg") 0 0 no-repeat; border:none; }
#menuh a.parent, #menuh a.parent:hover { background-position: right center; background-repeat: no-repeat; }
#menuh ul { list-style:none; float:left; width:109px; }
#menuh li { position:relative; min-height: 1px; vertical-align: bottom; }
#menuh ul ul { position:absolute; z-index:500; top:auto; display:none; padding: 1em; padding-top:8px; margin:-0.6em 0 0 -1em; }
#menuh ul li { background: url("vseobTla.jpg") 0 0 no-repeat; }
div#menuh li:hover { cursor:pointer; z-index:100; }
div#menuh li:hover ul ul,
div#menuh li li:hover ul ul,
div#menuh li li li:hover ul ul,
div#menuh li li li li:hover ul ul
{display:none;}
div#menuh li:hover ul,
div#menuh li li:hover ul,
div#menuh li li li:hover ul,
div#menuh li li li li:hover ul
{display:block;}
HTML:
Kód:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Drop-Down Menu</title>
<style type="text/css">@import url("menuh.css");</style>
<!--[if lt IE 7]>
<style type="text/css" media="screen">
#menuh{float:none;}
body{behavior:url(csshover.htc); font-size:100%;}
#menuh ul li{float:left; width: 100%;}
#menuh a{height:1%;font:bold 0.7em/1.4em arial, sans-serif;}
</style>
<![endif]-->
</head>
<body>
<div id="menuh">
<ul>
<li><a href="#" class="top_parent">Networking</a>
<ul>
<li><a href="#">Routers</a></li>
<li><a href="#">WiFi routers</a></li>
<li><a href="#">LAN cards</a></li>
<li><a href="#">Cables</a></li>
<li><a href="#">Others</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="#" class="top_parent">Computers</a>
<ul>
<li><a href="#">Laptops</a></li>
<li><a href="#">Desktop PC</a></li>
<li><a href="#">Monitors</a></li>
<li><a href="#">Accesories</a></li>
<li><a href="#">PC bags</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>
PS: mozno sa v css najdu pozostatky testovania, to staci odstranit
Blackshadow
Choď na stránku: