Avatar billede cortx Nybegynder
11. maj 2008 - 15:38 Der er 6 kommentarer og
1 løsning

ul,li height fejler i IE6

Hej eksperter.

Kan ikke få en li til at være 1px høj.

http://png.browsershots.org/7129b81f4a333de38dd7412ee9b2804d.png der ses problemet.. Koderne er som herunder:

#side ul {
    margin: 6px;
    padding: 0;
}

#side ul li {
    float: left;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#side ul li em {
    font-style: normal;
    margin-left: -17px;
}

#side ul li a {
    display: block;
    width: 138px;
    margin: 0;
    padding: 4px 0 4px 18px;
    color: #434d59;
    text-decoration: none;
}

#side ul li a:hover {
    text-decoration: underline;
}

#side ul li.spacer {
    width: 156px;
    height: 1px;
    background: url(../images/side-spacer.gif);
}


og htmlen

            <ul>
                <li><a href="vis_produkt.php"><em>1.</em> Yum yum Duck noodles</a></li>
                <li class="spacer"></li>
                <li><a href="vis_produkt.php"><em>2.</em> Yum yum Curry noodles</a></li>
                <li class="spacer"></li>
                <li><a href="vis_produkt.php"><em>3.</em> Yum yum Chicken noodles</a></li>
                <li class="spacer"></li>
                <li><a href="vis_produkt.php"><em>4.</em> Yum yum Kylling 30x60 gr.</a></li>
                <li class="spacer"></li>
                <li><a href="vis_produkt.php"><em>5.</em> Old Jamaica ingefær øl</a></li>
                <li class="spacer"></li>
                <li><a href="vis_produkt.php"><em>6.</em> Yum yum Beef noodles</a></li>
                <li class="spacer"></li>
                <li><a href="vis_produkt.php"><em>7.</em> Yum yum Thai sucki noodles</a></li>
                <li class="spacer"></li>
                <li><a href="vis_produkt.php"><em>8.</em> Yum yum Kim Chi noodles</a></li>
                <li class="spacer"></li>
                <li><a href="vis_produkt.php"><em>9.</em> Kopiko kaffe m. mælk bolsjer</a></li>
                <li class="spacer"></li>
            </ul>


Synes ikke noget virker.. heller ikke display: inline;

??

På forhånd tak,
Rasmus Henriksen
Avatar billede olebole Juniormester
11. maj 2008 - 15:51 #1
<ole>

Prøv:

#side ul li.spacer {
    width: 156px;
    height: 1px;
    font-size: 0;
    line-height: 0;
    background: url(../images/side-spacer.gif);
}

/mvh
</bole>
Avatar billede olebole Juniormester
11. maj 2008 - 15:53 #2
I stedet for:
    font-size: 0;
    line-height: 0;

- kan du opgså bruge 'overflow: hidden' - men jeg synes at kunne huske, det kan skabe problemer med li-elementer i visse browsere. Jeg kan dog også huske forkert ... test selv  =)
Avatar billede w13 Novice
11. maj 2008 - 16:03 #3
Oleboles bud lyder rigtigt.

Alternativt kunne det måske være, at display:inline; på li.spacer ville hjælpe?
Avatar billede olebole Juniormester
11. maj 2008 - 16:15 #4
w13 >> "Synes ikke noget virker.. heller ikke display: inline;"  ;o)
Avatar billede cortx Nybegynder
11. maj 2008 - 16:17 #5
overflow: hidden virkede - havde jeg faktisk ikke tænkt på :)
Avatar billede cortx Nybegynder
11. maj 2008 - 16:17 #6
smid et svar :)
Avatar billede olebole Juniormester
11. maj 2008 - 16:20 #7
Gerne  ;o)
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