ShockeR.: DIV im Firefox grösser als Inhalt. Wieso?

hallo forum,
ich habe ein problem welches nur im firefox und im opera auftritt.
ich habe einen div-layer in dem nur ein image angezeigt wird, das div hat weder breiten- noch höhenangaben. der div-container soll einfach nur  so gross sein wie das image da unterhalb des div's ein weiteres div nahtlos anschliessen soll...
im firefox und im opera werden unterhalb des images aber noch drei pixel angezeigt? habe schon diverse sachen ausprobiert, leider ohne erfolg :-(

hier mal der code.
html:
<div class="c_tc_image"><img src="images/fake/test.jpg" height="70" width="229" /></div>
<div class="c_tc_neutral">
blah blah...
</div>...

css:
.c_tc_image{
 overflow:hidden;
 border:0px;
 background-color:orange;
}

sobald ich dem div eine feste höhe zuweise wird es korrekt angezeigt, allerdings möchte ich das ganze flexibel halten und auf höhenangaben verzichten.

hat jemand eine idee woran das liegen könnte?

thx,
andré

  1. Hi,

    im firefox und im opera werden unterhalb des images aber noch drei pixel angezeigt?

    Das sollte Dich nicht undern. Solange das img als inline-Element an der Grundlinie dargestellt wird, wird für evtl. Textunterlängen Platz darunter freigehalten. Bei Schriftvergrößerung dürfte das dann auch mehr werden.

    freundliche Grüße
    Ingo

    1. Hi,

      im firefox und im opera werden unterhalb des images aber noch drei pixel angezeigt?
      Das sollte Dich nicht undern. Solange das img als inline-Element an der Grundlinie dargestellt wird, wird für evtl. Textunterlängen Platz darunter freigehalten. Bei Schriftvergrößerung dürfte das dann auch mehr werden.

      freundliche Grüße
      Ingo

      hey, danke für die superschnelle hilfe. ich hatte schon befürchtet das es soo einfach ist... ;)

      "line-height:0px" bewirkt wunder!!! :o)

      thx

      1. Hi,

        Solange das img als inline-Element an der Grundlinie dargestellt wird, wird für evtl. Textunterlängen Platz darunter freigehalten.

        "line-height:0px" bewirkt wunder!!! :o)

        warum so unschön? Mein Hinweis hätte Duich auf zwei saubere Lösungen bringen sollen:
        "als inline-Element" -> display:block;
        "an der Grundlinie dargestellt" -> vertical-align:bottom;

        freundliche Grüße
        Ingo

  2. Hello out there!

    im firefox und im opera werden unterhalb des images aber noch drei pixel angezeigt?

    Sicher, dass es drei sind? Verändere mal die Schriftgröße! Dann verstehst du auch, wo der Abstand herkommt.

    Deine Frage ist übrigens in den Forum-FAQ erwähnt: Woher kommen die Lücken zwischen meinen Bildern in der Tabelle?

    <div class="c_tc_image"><img src="images/fake/test.jpg" height="70" width="229" /></div>

    Wozu das div? Warum gibst du nicht dem img-Element die Klasse 'c_tc_image'?

    See ya up the road,
    Gunnar

    --
    “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)