Avatar billede Slettet bruger
08. september 2009 - 17:32 Der er 1 løsning

Ingen underpunkter i IE6?

Hej. Jeg har modificeret en ren CSS-dropdown menu til eget brug, men i IE6 kan jeg ikke se underpunkterne. Selve gardinet kommer godt nok frem i den rigtige størrelse, men ikke menupunkterne. Her er noget testkode :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#info {background:#f8f8f8; border:0;}
.menu {width:940px; height:33px; position:absolute; z-index:100; font-family:arial, sans-serif;}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0;list-style-type:none;}
.menu ul ul {width:134px;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {float:left;width:134px;position:relative;}
/* style the links for the top level */
.menu a, .menu a:visited {display:block; font-size:12px; text-decoration:none; color:#fff; width:132px; height:33px; background:blue; padding-left:0px; line-height:29px; font-weight:bold; text-align:center;}
/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:33px;left:0; width:132px;}
/* style the second level links */
.menu ul ul a:visited, .menu ul ul a {background:#717c04; color:#fff; height:auto; line-height:1em; padding:5px 5px; width:122px;border-width:0 0px 0px 0px;  text-align:left;}
/* style the top level hover */
.menu ul ul a:hover, .menu a:hover{color:#fff; background:#9dac0e; cursor:pointer;}
.menu ul ul :hover > a, .menu :hover > a {color:#fff; background:#9dac0e;  }
/* make the second level visible when hover on first level list OR link */
.menu ul a:hover ul, .menu ul li:hover ul {visibility:visible; background:#717c04;color:#fff; }
body { background-color:#000000; margin: 0; }
</style>
</head>
<body>
<div class="menu">
<ul>
<li>
<a href="index.php">Forside</a>
</li>

<li>
<a href="#">Main 1
<!--[if IE 7]><!--></a><!--<![endif]-->

    <ul>

    <li><a href="#">Sub 1.1</a></li>
    <li><a href="#">Sub 1.2</a></li>
    <li><a href="#">Sub 1.3</a></li>
    <li><a href="#">Sub 1.4</a></li>

    </ul>

</li>

<li>
<a href="#">Main 2
<!--[if IE 7]><!--></a><!--<![endif]-->

    <ul>

    <li><a href="#">Sub 2.1</a></li>
    <li><a href="#">Sub 2.2</a></li>

    </ul>

</li>
<li>
<a href="#">Main 3</a>
</li>
</ul>
</div>
</body>
</html>

Nogen der kan se, hvad problemet er?
Mvh Jesper
Avatar billede Slettet bruger
11. september 2009 - 14:42 #1
lukker
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester