• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bild verändert Tabelle

syuam

Neues Mitglied
Hey Leute :)
Ich möchte Bilder in einer Tabelle im Frontend wiedergeben.
Hierfür benutze ich folgenden HTML-Code:
HTML:
<table>
  <tr>
    <td><img src="/upload/datei1.txt" border="" height="50px" width="50px" alt="" /></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
  </tr>
</table>
Und den folgenden CSS-Code:
Code:
* {
    margin: 0;
    padding: 0;
}
table {
    border: 10px solid black;
    border-collapse: collapse;
}
td {
    padding: 0;
    height: 50px;
    width: 50px;
    border: 1px solid red;
}
Das Bild wird ordnungsgemäß(50px*50px) ausgegeben, jedoch entsteht unterhalb des Bildes ein leerer kleiner weißer Streifen, der da nicht sein sollte...Das Bild, sowie auch das "td" sind 50px*50px groß, wieso zieht sich das "td" jedoch in die Länge?
Hier ein Bild davon:
b1.JPG
Wie kann ich das beheben? ich komm einfach nicht drauf...
LG und danke im vorraus liebe community!
 
Werbung:
hey syuam,


also ich habe es genau so wie du versucht, bei mri taucht das nicht auf.
Hast du eventuell die tabelle noch im css wo anders definiert ?

Mfg
Flava
 
Ich weiß nicht, ob das mit dem Problem zu tun hat, aber diese Schreibweise
Code:
[COLOR=#800080]height=[COLOR=#0000FF]"50px"[/COLOR] width=[COLOR=#0000FF]"50px"[/COLOR][/COLOR]
ist mir unbekannt. Das müsste eigentich so aussehen:
Code:
[COLOR=#800080]height=[COLOR=#0000FF]"50"[/COLOR] width=[COLOR=#0000FF]"50"[/COLOR][/COLOR]
Alternativ:
Code:
style="[COLOR=#800080]height:[COLOR=#0000FF]50px;[/COLOR] width[COLOR=#0000FF]:50px;"[/COLOR][/COLOR]
 
Werbung:
Das hat doch mit der CSS-Eigenschaft vertical-align zu tun:

Code:
td img { vertical-align:bottom; }
 
Das Problem "trat" im browser mozilla auf.
einfach:

td img { vertical-align:bottom; }
hinzufügen, dann klappt es, danke!
 
Werbung:
Zurück
Oben