Tabelle - Zeilenhöhe
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
ansehen
beschreibung
bild
code
einnehmen
externe datei
foto
paar
problem
raffinesse
rechten spalte
restlichen platz
setzen
spalte
spalten
tabelle
tag
versuchen
zeile
zelle
-
ho ;)
Hab mal wieder eine Frage an HTML- und CSS-Kenner :D
Und zwar habe ich eine tag/tabelle">Tabelle mit einer unterschiedlichen Zeilenanzahl pro Spalte
Das ganze sieht so aus, dass es zwei Spalten gibt.
In der linken Spalte ist eine Zeile (Ein Bild - zwischen 100px und 120px hoch)
In der rechten Spalte gibt es 4 Zeilen.
<table> <tr> <td rowspan="4">FOTODATEI</td> <td>Beschreibung – Datum</td> </tr> <tr> <td>Fotos gemacht von</td> </tr> <tr> <td>Ansehen</td> </tr> <tr> <td>Download</td> </tr> </table>
So... Da das Foto aber höher ist, als 4 schriftliche Zeilen, werden die Zeilen auseinander gezogen.
Zur Verbildlichung: (Der Quote-Strich simuliert mal das Bild XD )
Ich hätte gerne:
Beschreibung
Fotos von
Ansehen
Download
Stattdessen bekomme ich:
Beschreibung
Fotos von
Ansehen
Download
Ist etwas blöd zu erklären, aber ich hoffe, ihr wisst, was ich meine...
In meinen Augen gibt es schon eine Lösung:
Eine Zeile, eine Spalte...
Links das Bild, und rechts vier Zeilen (in einer Spalte mit <br /> getrennt...)
Dann wären die 4 Schriftzeilen mit normalem Abstand.
Allerdings finde ich diese Sache nicht wirklich hübsch, und hoffe auf ein wenig Raffinesse von denen, die sich etwas besser damit auskennen :)
Vielen Dank im Voraus für alle Tipps
Sincer
Beitrag zuletzt geändert: 7.9.2009 17:26:52 von sincer -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Hallo,
haste einen Link?
Ich glaube das könnte wirklich schwer werden. Man könnte vllt. versuchen, die einzelnen "td" kleiner zu machen:
Allerdings müsste dann das letzte den restlichen Platz einnehmen.<td style="height:1.2em;">
-
Wozu überhaupt eine Tabelle?
Vier Paragraphen und ein das Image nach links floaten lassen. Dann noch genügend Margin für das Bild setzen und gut ist.
Alternativ tut es auch eine Tabelle mit nur einer Zeile und 2 Spalten. -
hallo,
vielleicht weniger elegant, aber falls alle Stricke reißen:
in der rechten Spalte genauso viele Zeilen erstellen wie in der rechten, dann für diese Zellen
<td style="vertical-align:top;">
setzen und in der Zelle selbst eine zweite Tabelle oder ein paar <p>s oder <div>s statt der bisher verwendeten Zellen nutzen.
Also in etwa:
<table> <tr><td><img src=""></td><td style="vertical-align:top;"><p style="margin:1px">Punkt1</p><p style="margin:1px">Punkt2</p></td></tr> </table>
natürlich würde ich mir dann für die <p>s ne geeignete Klasse schreiben...und das da nicht direkt reinquetschen
Beitrag zuletzt geändert: 7.9.2009 18:00:10 von aldistammkunde -
@werktags:
JAU :)
werktags schrieb:
Allerdings müsste dann das letzte den restlichen Platz einnehmen.
Dafür gibt es ja dann vertical-align:top; Dann wäre zwar der Platz größer, aber sehen könnte man es nicht mehr...
Funktioniert perfekt - Danke ;)
Auch an alle anderen ein Dankeschön.
//EDIT: Eure Lösungsvorschläge sind meiner Meinung nach auch machbar, allerdings habe ich für heute (aus welchem Grund auch immer) das Gefühl gehabt, dass es eleganter wäre, dass Problem mit einer ganz normalen Tabelle zu lösen XD
(Ohne Breaks und Divs, usw...)
Problem gelöst ;)
thx
Sincer
Beitrag zuletzt geändert: 7.9.2009 18:08:40 von sincer -
vielleicht so:
<tr heigth="HOEHE"> <td> </td> </tr>
wobei HOEHE die höhe bezeichnet -
Nein, die Zeiten sind lange vorbei, heute gibt man die Höhe mit CSS an
table tbody tr td { height:20px; }
Außerdem würde ich empfehlen die CSS-Eigenschaften alle in eine externe Datei zu schreiben. der Style-Tag versaut einem nur den Code. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage