Hvit romkrypenes i Line / List elementer (li) i IE6
Hvis du noensinne har gjort (eller lage en) en vertikal meny med listeelementer (Li) tagger og CSS, kan det oppstå, dette enda en feil i Internet Explorer, hvor IE 6 inserts disse gapene mellom listeelementer som inneholder block-nivå elementer, dvs. hvis det er noen mellomrom mellom listeelementene i markeringen. Takk, men ingen takk, synes IE versjon 7 fri fra denne feilen.
Hvis som meg, og mange flere, tilhører du til dette bandet av frustrerte utviklere, som fortsatt har for å få sine nye oppsett, som arbeider i IE6 også, så dette kan vise seg nyttig. Ta en titt ...
Eksempel markering:
<ul id="menu">
<li> <a href="#"> Hjem </ a> </ li>
<li> <a href="#"> Om </ a> </ li>
<li> <a href="#"> Services </ a> </ li>
<li> <a href="#"> portefølje </ a> </ li>
<li> <a href="#"> FAQ </ a> </ li>
<li> <a href="#"> Kontakt oss </ a> </ li>
</ Ul>
Du kan skape litt CSS, lik en nedenfor, for å transfrom ovenfor markup i en vertikal meny ....
Eksempel CSS ...
# Meny {
margin: 0; padding: 0; bakgrunn: # FF9900;
list-style-type: none; width: 150px;
}
# Meny li {margin: 0; padding: 0;}
# Meny a {display: block;
color: # 555555;
text-decoration: none;
padding: 0 15px;
line-høyde: 2,5; border-bottom: 1px solid # FFF;
}
Resultatene vil du se ...
Løsning for denne feilen ... (modifisert / lagt CSS i fet kursiv)
# Meny {
margin: 0; padding: 0; bakgrunn: # FF9900; list-style-type: none; width: 150px;
float: left; / * dette inneholder fløt listeelementer * /
}
# Meny li {
margin: 0; padding: 0;
float: left; / * Dette løser * /
width: 100%; / * whitespace bug i IE6 * /
}
# Meny a {
display: block; color: # 555555;
text-decoration: none;
padding: 0 15px;
line-høyde: 2,5; border-bottom: 1px solid # FFF;
}
Hvis ovenstående løsningen doesnot synes å fungere (for grunner kjente til IE6 bare) ... prøve denne metoden i stedet
Bare legg denne ekstra IE6 bare stiler til markup din ...
<- [If lt IE 7>
<style type="text/css">
# Meny li a {display: inline-block;}
# Meny li a {display: block;}
</ Style>
<[Endif] ->










































