Avatar billede nielyng Nybegynder
01. december 2006 - 00:06 Der er 1 løsning

Styling af liste-menu ligner en trappe..

Hej Alle!

Jeg har brug for et par friske øjne til et problem med en menu (liste).

Problemet er, at listen ligner en trappe i IE mens den ser helt fin ud i firefox. Jeg ved at min styling af links konflikter med min styling af div og liste, men jeg kan bare ikke få øje på problemet. Jeg har fremstillet et minimalt "test-case", der kan ses her: http://www.fastlane.dk/minimal

Min html/css ser sådan her ud:

<div id="navigation">
   

<ul id="menu">
<li>Forside</a>

</li>
<li><a href="#" target="_top">Nyheder</a>
</li>
<li><a href="#" target="_top">Temaer</a>
<ul style="display: none; visibility: hidden;" id="menu">
<li><a href="#" target="_top">Tema nr 1</a>
</li>
</ul>
</li>
<li><a href="#" target="_top">noget</a>

</li>
<li><a href="#" target="_top">noget andet</a>

</li>
</ul>  </div>

Styling:

body {

padding:0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:small;
background-image:url(gfx/bg.gif);
}

#navigation{
width: 726px;
height: 29px;
background-image:url(gfx/bar.gif);
}

* Navigation for drop downs*/
ul li#bypass{
display:none;
}
#navigation ul{
height:18px;
width:100%;
margin:0;
padding:0;
background:#FFFFFF;
color:#ffffff;
list-style-type:none;
display:inline;
}

#navigation li ul{
border-top:1px solid #ffffff;
margin-top:23px;
display:none;
position:absolute;
width:120px;
height:auto;
}
#navigation li li{
width:120px;
}
navigation a:link, #navigation a:visited{

float:left;

margin:5px;

padding:0;

font-size:x-small;

font-weight:600;

text-decoration:none;

text-transform:uppercase;

background-color:#ffffff;

border:0;

border-bottom:none;

color:#000000;

}



#navigation a:hover, #navigation a:active{

margin:5px;

padding:0;

padding-bottom:3px;

font-size:x-small;

font-weight:600;

text-decoration:none;

text-transform:uppercase;

background-color:#ffffff;

border:0;

border-bottom:3px solid #3399cc;

color:#3399cc;

}

Hvem kan sige mig hvori konflikten ligger? Og hvordan jeg løser konflikten?

Jeg benytter mig desuden af et javascript, der sørger for at skjule undermenuer og gøre dem synlige igen..

MANGE tak!

/NileZ
Avatar billede nielyng Nybegynder
06. december 2006 - 22:47 #1
NEvermind, jeg har løst det.
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