martin: abstand unterm image-tag

hallo,
ich habe ein problem mit einem css-stylesheet und dem IE5. der code sieht wie folgt aus:

<html>
<head>
<title>test</title>

<style type="text/css">
<!--
body {
margin:0;
text-align:left;
font-size:12px;
font-family: Arial, Helvetica, sans-serif;
}
#main {
width: 780px;
margin: 0px auto;
text-align:left;
}
#top {
background-color: #ff0000;
height: 200px;
border-bottom:1px solid #0000ff;
text-align:left;
line-height:0px;
}
#mitte {
background-color: #ffff00;
color:#333333;
text-align: left;
}
-->
</style>

</head>

<body>
<div id="main">
<div id="top"><!-- #top oeffnen -->
<img src="test.jpg" width=275 height=200 border=0 alt="">
</div><!-- #top schliessen-->
<div id="mitte"><!-- #mitte oeffnen-->
mitte
</div><!-- #mitte schliessen -->
<div id="footer"><!-- #footer oeffnen -->
footer
</div><!-- #footer schliessen -->
</div><!-- #main schliessen -->
</body>
</html>

... jetzt wird aber im top-div hinter dem image ein leerraum angezeigt, der nicht gewünscht ist. das bild sollte praktisch genau auf dem border des top-divs liegen.
im mozilla wird es richtig angezeigt, der IE5.5 fügt wie gesagt 3-4 pixel unter dem image ein.
meine versuche mit margin und padding führten nicht zum erfolg...

ciao
martin

  1. Hallo Martin,

    im mozilla wird es richtig angezeigt, der IE5.5 fügt wie gesagt 3-4 pixel unter dem image ein.
    meine versuche mit margin und padding führten nicht zum erfolg...

    Wo hast du margin, padding eingesetzt? Ich kann anhand deines Codes nur Vermutungen anstellen ....

    Ein Beispiel:
    <div><img></div>  ist _nicht_ gleich

    <div>
    <img>
    </div>

    Probier es einfach mal aus.

    Grüße,

    Jochen (Zweigposter)
    [pref:t=72263&m=416331]

    1. hallo jochen,
      danke für deine lösung, sie funktioniert. kann man es denn mit einer zusätzlichen angabe hinbekommen, dass das beispiel _doch_ gleich ist? oder muss ich immer darauf achten, dass hinter dem letzten element des div-containers keine leerzeichen, zeilenumbrüche etc. sind?

      Ein Beispiel:
      <div><img></div>  ist _nicht_ gleich

      <div>
      <img>
      </div>

      Probier es einfach mal aus.

      ciao
      martin

      1. Hallo.

        oder muss ich immer darauf achten, dass hinter dem letzten element des div-containers keine leerzeichen, zeilenumbrüche etc. sind?

        Ja, denn wenn du ein oder mehrere Leerzeichen oder einen oder mehrere Zeilenümbrüche in deinem Quelltext sthen hast, kann ein Browser nur die Regel anwenden, alles zu einem Leerzeichen zusammenzuziehen, da er ja kaum erraten kann, welche Leerzeichen du wirklich beabsichtigt hast und welche eher zufällig in deinem Quelltext gelandet sind.
        MfG, at

  2. Welchen Wert hat vertical-align?
    Ich vermute baseline.

    Ändere den mal.

    MfG
    Klaus

    1. hallo klaus,

      Welchen Wert hat vertical-align?
      Ich vermute baseline.

      der wert ist gar nicht gesetzt. wenn ich vertical-align: bottom setze, funktioniert es trotzdem nicht.

      ciao
      martin

      1. der wert ist gar nicht gesetzt. ...

        Unsinn!, es gibt immer einen Defaultwert. Nimm den DOM-Inspector zur Hilfe und schau bei Computed Styles nach.

        MfG
        Klaus