div container ohne zwischenraum

[julifx]

also ich bin einer der immer noch klassisch html macht weil das schneller geht  (für mich )
 jetzt wollte ich mal in css machen schaffe aber seit stunden nicht das simple problem das ausschliesslich im ie einen abstand zwischen den <div macht .

beispiele siehe link: grafik wird 4 mal wiederholt und immer ist ein leerraum vorhanden - wie gesagt nur im ie
wie geht der weg ?

habe
 margin: 0 ;
 padding: 0 0 0 0;
für den style gesetzt - ohne erfolg .

danke für hilfe ?

[Detlef G.]

Hallo julifx

beispiele siehe link: grafik wird 4 mal wiederholt und immer ist ein leerraum vorhanden - wie gesagt nur im ie
wie geht der weg ?

habe
margin: 0 ;
padding: 0 0 0 0;

Das geht kürzer (padding: 0;), dürfte aber nichts bewirken, weil dies die Standardwerte für Divs sind.

  <div id="gfx" class="gfx">  
 <img src="Bilder/head-D-Prod-willkommen.gif" >  
  </div>  

Du hast hier eine ganze Reihe von Whitespaces (Leerzeichen, Tabs, Zeilenwechsel), die zu jeweils einem Leerzeichen verkürzt dargestellt werden und IMG ist ein Inlineelement und steht Textfluss auf der Grundlinie des Textes. Dabei berücksichtigt der IE auch die Unterlängen (z.B. bei p, q, g, j), selbst dann, wenn kein Text vorhanden ist.
Du könntest die Whitespaces entfernen, das Bild mittels vertical-align passend ausrichten oder ihn mit display:block zu einem Blockelement machen, welches sich dann nicht um diese kümmert, weil es ja einen eigenen Block bildet und nicht im Textfluss steht.

Auf Wiederlesen
Detlef

[Mathias]

beispiele siehe link: grafik wird 4 mal wiederholt und immer ist ein leerraum vorhanden - wie gesagt nur im ie
wie geht der weg ?

Das Problem liegt nicht am CSS, sondern an einem Fehler im IE (auch im neuen IE7), der die whitespaces zwischen dem div-Tag und dem img-Tag anzeigt.
Einfache Lösung: alle whitespaces löschen, also einfach
<div class="gfx" ><img src="Bilder/head-D-Prod-willkommen.gif"></div>
schreiben!

Gruss,
Mathias

[Gernot Back]

Hallo Mathias,

Das Problem liegt nicht am CSS, sondern an einem Fehler im IE (auch im neuen IE7), der die whitespaces zwischen dem div-Tag und dem img-Tag anzeigt.

In der Tat ein Fehler des IE:

http://www.w3.org/TR/html401/appendix/notes.html#notes-line-breaks

Einfache Lösung: alle whitespaces löschen, also einfach
<div class="gfx" ><img src="Bilder/head-D-Prod-willkommen.gif"></div>
schreiben!

Dennoch gefällt mir der Quellcode-Übersichtlichkeit halber Delefs CSS-Lösung besser.

Frei nach Loriot:
Ich lasse mir doch von einem kaputten IE nicht vorschreiben, wo ich in meinem HTML-Code hinzugucken habe.

Gruß Gernot

[mathias]

Dennoch gefällt mir der Quellcode-Übersichtlichkeit halber Delefs CSS-Lösung besser.

Frei nach Loriot:
Ich lasse mir doch von einem kaputten IE nicht vorschreiben, wo ich in meinem HTML-Code hinzugucken habe.

Ja stimmt, Detlefs Lösung mit display:block für das img-Element ist schöner, aber das Löschen der whitespaces ist in den meisten Fällen einfacher...

Ausserdem:
If a web browser is defective, causing errors in the display or performance of the page, should the page developer struggle to hide the browser's defects, or should the defects be revealed in hope of creating market pressure to force the browser maker to make good? By which approach is humanity better served?
(www.crockford.com)