Beste SD-leden,

Ik ben bezig met een pagina, nu probeer ik dus een verticale streep neertezetten dmv een div met een achtergrond kleur en een height: 1px in FF pakt hij deze gewoon netjes mee.
Maar je raad het al, IE werkt weer eens niet mee. IE rekt de div zo'n extra 10px uit. Behoorlijk frustrerend
Desbetreffende stuk:

Code:

#under_header {
    background-image:url(images/balk.png);
    position:absolute;
    top: 772px;
    left: 1px;
    width: 946px;
    height: 8px;
    z-index:1;
}

Afbeelding:
http://img460.imageshack.us/img460/5...strange0lh.png

Wie ziet de fout?

Vriendelijke Groet,

Jos Ruigrok

Kan je ook de html code even neerzette ?

verticale streep neertezetten dmv een div met een achtergrond kleur en een height: 1px

Dit snap ik precies niet. Bedoel je niet horizontale streep ?

Origineel gepost door Dirk Bonhomme

Kan je ook de html code even neerzette ?

Dit snap ik precies niet. Bedoel je niet horizontale streep ?

Sorry typefout, moet inderdaad een Horziontale streep zijn.

HTML:

Code:

<div id="horz_line"></div>

Daar zijn we nog niets mee :P
Kan je niet de volledige html-pagina + het css bestand hier zetten ? Dan is het veel makkelijker om de mogelijke fout te zoeken :-)

Hehe ik vind het best hoor, ik knal hier gewoon wel het deel wat echt van belang is hier neer. De rest zit de fout niet in omdat ik al genoeg gekloot heb dat ik daar achter ben.

HTML:

Code:

<div id="content_background">
 </div>
<div id="vert_line">
</div>
<div id="horz_line"></div>

CSS:

Code:

#content_background {
    background-color:#FFFFFF;
    position:absolute;
    top: 122px;
    left: 1px;
    width: 946px;
    height: 650px;
}
#vert_line {
    background-color:#d9d7d8;
    position:absolute;
    top: 196px;
    left: 314px;
    width: 4px;
    height: 286px;
    z-index:5;
}

#horz_line {
    
    position:absolute;
    top: 634px;
    left: 8px;
    width: 932px;
    height: 1px;
    z-index:5;
    
    background-color:#d9d7d8;
}

Dit is dus de achtergrond met daarop de vertikalelijn die hij overigens wel goed weergeeft, en de horizontale lijn. De rest van de html heeft tot deze blokken geen relatie.

Zeer vreemd. Als ik in Opera een " " tussen de tags zet wordt hij ook zo hoog. Waarschijnlijk is dit dus de minimum hoogte in IE ofzo. Ik heb het probleem iig nog niet meegemaakt.

Omdat je toch met absolute positionering werkt is de volgende oplossing mischien al voldoende:
background-color vervanger door border-top:1px solid #d9d7d8;

Super werkt nu :), ik vond het idd ook een vreemd probleem ook omdat ik op google niets kon vinden over dit eufel.

Als iemand een goede oplossing weet om Max-Height in IE na te bootsen, graag even een berichtje achter laten.

Je kan toch ook gewoon een horizontal-rule gebruiken, niet? Code hiervoor die cross-browser werkt (zonder die vieze IE schaduw) is de volgende:

Code:

hr{height:0px;border:0px solid #000;border-top-width:1px;}

Origineel gepost door Stefan Verbakel

Je kan toch ook gewoon een horizontal-rule gebruiken, niet? Code hiervoor die cross-browser werkt (zonder die vieze IE schaduw) is de volgende:

Code:

hr{height:0px;border:0px solid #000;border-top-width:1px;}

Ok bedankt, deze neem ik mee voor als ik er nog eens tegen aan loop.