[IE6] maakt div met evengroot plaatje erin groter

[JayVee]

Hey!

Ik heb een probleem op een site van mij geisoleerd om te kijken waarom IE het niet zo fijn vindt. (Firefox "uiteraard" wel ).

De opmaak (maar dan inline styles):

HTML:

<div style="margin: 0px; border: 0px; padding: 0px; height: 150px;">
  [img]"nootje.jpg"[/img] 
</div>

Check hier het complete doc.

Het resultaat in IE:


Ik heb echt al van alles geprobeerd: hoogte wel of niet aangeven (plaatje IS 150px hoog), hoogte in HTML of CSS aangeven, andere margins, paddings, borders van de div en het plaatje.

Weet iemand zeker dat dit een bug is? Doe ik iets fout? Iemand een workaround?

[ Voor 8% gewijzigd door JayVee op 06-06-2004 22:13 ]

[Rickets]

Whitespace om de image-tag weghalen wil wel eens helpen.

[JayVee]

holy crap! Het werkt! @ Rickets en @ IE6!

//edit: maaar, het probleem is nog niet opgelost. Ik heb in die div namelijk nog tekst staan. En dan wil het al niet meer. Zal de startpost even updaten...

//edit2:
damn, ik had later staan:

HTML:

<div id="banner"><p class="slogan">
    w00t w00t w00t<br /><i>bla bla bla</i>
</p>[img]"nootje.jpg"[/img]</div>

Zo stond er dus alleen whitespace IN de <p>. En ook dat vindt IE niet goed genoeg. Hiermee werkt het wel:

HTML:

<div id="banner"><p class="slogan">w00t w00t w00t</p>[img]"nootje.jpg"[/img]</div>

(ff wat dingen weggehaald om de GoT layout niet te verneuken)

Wow! Dat was de snelste GoT oplossing ooit! Nog eens en voor Rickets!

[ Voor 255% gewijzigd door JayVee op 06-06-2004 22:27 ]

[Verwijderd]

Flexibelere oplossing waar ik laatst achter kwam is de volgende CSS

Cascading Stylesheet:

#banner img {
  vertical-align: top;
}

Zo kan je whitespace lekker laten staan en ziet je source er mogelijkerwijs netter uit ook...