IE lässt in einer Tabelle am unteren Zellenrand immer Platz

[kaniggel]

Hallo zusammen,
wie kann man verhindern, dass der IE am unteren Zellenrand in einer Tabelle immer Platz lässt (ca. 4 Pixel Höhe). Im Firefox wird es korrekt dargestellt.

Ich verwende z.B. folgenden einfachen Quellcode:

<table border="5" cellspacing="0" cellpadding="0">
<tr>
<td>
<img src="bild1.jpg"/>
</td>
</tr>
<tr>
<td height=200 valign=bottom>
<img src="bild2.jpg"/>
</td>
</tr>
</table>

=> unterhalb von bild1 sind ca. 4 Pixel Platz, dann kommt die Trennlinie zur nächsten Zelle, in der dann das bild2 ist. Trotz valign=bottom wird dieses auch nicht ganz unten sondern mit 4Pixel Abstand zum unteren Zellenrand dargestellt.

Über eine Hilfe wäre ich sehr dankbar!
kaniggel

 

[Imbericle]

1. Ich wette meine Oma, dass du Tabellen hier falsch einsetzt
=> Tabellen verwendet man nicht mehr zum Gestalten von jedem kleinem Pups, man nimmt Tabellen wirklich nur noch für Tabellen, da man sogut wie immer nur Kot baut, wie bei dir.

2. Links zur Seite schicken, niemand hat Lust den Quellcode kopieren zu müssen um ihn sich anzusehen

3. SELFHTML: HTML/XHTML / Allgemeine Regeln für HTML / Grundgerüst einer HTML-Datei

4. xhtml css tutorial# - Google-Suche

CSS 4 You - The Finest in Stylesheets



MfG

 

[Gilles]

Und so nebenbei: Wie verwende ich Code-Tags im Forum?

 

[kaniggel]

Hallo,
danke für die Antworten.
Ich hatte bei der Dokumenttyp-Deklaration einen Fehler; hatte die kopiert und da ich wenig Ahnung von html hatte ist mir das nicht aufgefallen.

Vielen Dank auch für die links!
kaniggel

 

[kaniggel]

Hallo,
leider funktioniert die Darstellung im IE6.0 immer noch nicht. Ich hatte den Doctype eingefügt und danach dann mit IE8 getestet, da gehts, aber nicht in alten Versionen.
Hier der Link zu der Seite, damit ihr mal direkt den kompletten Sourcecode anschauen könnt:

bild


Wie bekomme ich den schmalen Rand unter den Bildern im IE6 weg?

Für Hilfe wäre ich sehr dankbar!

kaniggel

 

[Efchen]

Für was ist die Tabelle?
Wieso mischst Du noch Inhalt und Layout, indem Du altbackene HTML-Attribute verwendest, wo Du CSS verwenden sollst?

Den Rand bekommst Du weg, indem Du das Whitespace zwischen dem <img>-Tag und dem </td> löschst. Das ist ein Klassiker unter den IE6-Fehlern.

 

[kaniggel]

Hallo Efchen,
vielen Dank für den Hinweis mit dem Leerzeichen. Hab's entfernt und es funktioniert.
Die Seite dient für mich nur als Testseite um meine ersten Schritte mit html zu probieren.

Mein Code ist noch ziemlich "unschön" weil ich bisher noch nicht viel Ahnung von html/css habe... Für Verbesserungen bin ich aber dankbar.

kaniggel

 

[Efchen]

Naja, lerne, wozu HTML und CSS eigentlich da sind.

HTML: Semantik. Nur logische Inhaltsauszeichnung, d.h. da gibst Du dem Inhalt mit den richtigen Tags eine logische Bedeutung. HTML ist in keiner Weise für die Ausgabe zuständig. Das heißt, alles was Du in HTML machst, was der Anzeige dient, ist falsch. Also die Tabelle, denn Du hast ja keine tabellarischen Daten und nutzt die Tabelle nur zur Positionierung der Bilder und für den Abstand. Dann die Attribute height, border, cellspacing, cellpadding, valign.
Außerdem solltest Du HTML-Code immer validieren, dann fällt Dir auf, dass das <img>-Tag ein Pflichtattribut hat, nämlich alt.

CSS: Nur Anzeige! Layout und Design. CSS bringt in die semantische Struktur, die mit HTML festgelegt wurde, ein ansprechendes Aussehen.

Inhalt (HTML) und Layout (CSS) immer strikt voneinander trennen, dann gibts keine Probleme. So kann der HTML-Code von einem Client, der eine Website nicht visualisiert (Suchmaschine, Vorlesebrowser) den Inhalt richtig klassifizieren und visuelle Browser können das CSS lesen und die Inhalte auch entsprechend visualisieren.
Stylesheet auslagern. Schafft Übersicht.