<li>-meny vil ikke fungere i IE

[Anders Moen]

Hei!

 

Driver å lager en side, men jeg får ikke menyen til å fungere i IE (det er en <li>-meny)

 

 

XHTML:

<ul id="nav">
<li class="menu" id="active"><a href="">Forside</a></li>
<li class="menu"><a href="">Forside</a></li>
<li class="menu"><a href="">Forside</a></li>
<li class="menu"><a href="">Forside</a></li>
<li class="menu"><a href="">Forside</a></li>
<li class="menu"><a href="">Forside</a></li>
</ul>

 

CSS:

li.menu a {
color: #FFF;
text-decoration: none;
float: left;
padding-top: 0px;
padding-bottom: 2px;
padding-left: 10px;
padding-right: 10px;
list-style-type: none;
text-align: center;
}

li.menu a:hover {
color: #c6ad78;
text-decoration: none;
float: left;
padding-top: 0px;
padding-bottom: 2px;
padding-left: 10px;
padding-right: 10px;
list-style-type: none;
}


li#active a {
color: #78a7d7;
text-decoration: none;
float: left;
padding-top: 2px;
padding-bottom: 2px;
padding-left: 10px;
padding-right: 10px;
list-style-type: none;
}

 

 

 

Sorry, men nå klikker oc'n min totalt...får ikke opp start menyen, men det er vel bare sånt jeg må regne med når jeg sitter på det supre operativsystemet Windows

 

Tar screenshots av åssen det ser ut når jeg har skrudd på pc'n igjen.

[Torjus]

Hadde nok vært lettere for oss om du hadde gitt oss en link.

[Anders Moen]

Ja, hei igjen. Nå funker pc'n igjen.

 

Vent litt, skal laste opp

 

www.andersmoen.com/li.php

[Runar0]

list-style: none; skal i ul#nav og ikkje li.menu. Vist du ikkje absolutt treng å bruke ein klasse på li elementa så kan du bruke ul#nav li a {}

 

Noe slik:

CSS:

ul#nav {
   padding: 0px;
   margin: 0px;
   list-style: none;
}
ul#nav li a {
  color: #333;
  text-decoration: none;
  float: left;
  padding-top: 0px;
  padding-bottom: 2px;
  padding-left: 10px;
  padding-right: 10px;
  list-style-type: none;
  text-align: center;
}

ul#nav li a:hover {
  color: #c6ad78;
  text-decoration: none;
  float: left;
  padding-top: 0px;
  padding-bottom: 2px;
  padding-left: 10px;
  padding-right: 10px;
  list-style-type: none;
}


li#active a {
  color: #78a7d7;
  text-decoration: none;
  float: left;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 10px;
  padding-right: 10px;
  list-style-type: none;
}

 

HTML

<ul id="nav">
  <li id="active"><a href="">About</a></li>
  <li><a href="">About</a></li>
  <li><a href="">About</a></li>
  <li><a href="">About</a></li>
  <li><a href="">About</a></li>
  <li><a href="">About</a></li>
  <li><a href="">About</a></li>
  <li><a href="">About</a></li>
</ul>

[Anders Moen]

Hmm...den eneste forskjellen nå i IE er at de prikkene ble borte, men takk alikevel

[Ståle]

Virker det na, skjonte ikke problemet engang jeg.

[Anders Moen]

Hm, prøver å forklare her igjen

 

Se på denne siden i IE og Opera. Du ser forskjellen på de? IE lister nedover, men ikke rett ned. Helt på enden av hver <li> så kommer neste hvis du skjønner. Bare se å du skjønner det nok

[Runar0]

Ah prøv med display: inline; på li elementa

[Anders Moen]

Nope, står fortsatt sånn skrått nedover

[funkweb]

Hva med å fjerne alle disse padding og sleng dem inn.

 

#nav li {
list-style-type: none;
padding-top: 0px;
padding-bottom: 2px;
padding-left: 10px;
padding-right: 10px;
}

[eigan]

Hadde samme problemet for litt siden, fikset det, men husker ikke hva jeg gjorde, og jeg sitter vekke fra den dataen nå, så får ikke sett over..

 

Men du kan jo prøve clear:left på li da, har selv aldri prøvd det..

 

Shadows: Du trenger ikke skrive på :hover allt som står i a fra før, eneste som trengs å skrives, er det som endrer seg.