|
|||
Bild und Text in einer Zeile horizontal mittig zentrieren?
Hallöchen,
ich hab in einer Tabellenzeile ein Bild und danach einen Text stehen. Ausschnitt: Nun sieht man ja was das Problem ist: Der Text steht irgendwo am Fuß des Bildes... Ich hab es bereits mit Listen probiert aber auch da ist das gleiche. Die einzige Lösung die ich bisher gefunden habe, ist das Bild und den Text in verschiedene Divs schieben und die Abstände dann anpassen. Nur gibt das bei vielen Einträgen massig Divs und bei unterschiedlichen Bildgrössen ist das auch keine Lösung... Gibts da eine Eigenschaft für? Danke, McFarlane |
Sponsored Links |
Sponsored Links |
|
|||
Nun, Dekografiken sind es leider nicht, das wär zu einfach^^.
Die Bilder können von verschiedenen größen sein und je nach eingestelltem Style auch ganz verschieden aussehen. Das mit der Klasse funktioniert deshalb auch nur wenn die Bilder die gleiche Größe haben. |
|
||||
Wenn sich alles in einer Zeile abspielt, hilft vertical-align. Anderfalls dieses Prinzip: Centering (horizontally and vertically) an image in a box
|
|
|||
hmm, ich habs jetzt so gemacht:
um den Text ist ein <p> Element und das Bild hat ein Float-Left bekommen. Dadurh geht dann auch das vertical-align ganz wundervoll. Das komische ist nur, dass ich für jedes <img> den Style direkt in das Bild schreiben muss, weil es als Klasse nicht funktioniert: So hab ich es jetzt: Code:
<img style='float:left;' src=... /> Code:
<img class='fileimg' src=... /> Code:
.fileimg {float:left;} |
|
||||
Zitat:
Code:
<p><img src="bild.jpg" /> Text</p> Dazu und vor allem zu Deinem anderen Problem lade das Ganze mal hoch und poste den Link. |
|
|||
Also Hochladen kann ichs noch ni, weil das ein Filebrowser wird und der zur Zeit noch recht unsicher ist...
Aber ich hab Poste hier mal den Quellcode von einer Zeile der Tabelle. Wundert euch mal nicht über das , das ist grad einfah nur da, es kommen noch andere Spalten dahinter. Code:
<tr> <td> <img width='24' height='24' style='float:left;' src='./style/crystal/filetypes/php.png' alt='php'/> <p>browser.php</p> </td><td> </td> </tr> Zu dem anderen Problem: Ich hatte einfach den Style in jedem <img> Element durch eine Klasse für alle ersetzt. Und das hat den Text unter den Bildern angezeigt. EDIT: Da das die Lösung von hubspe ist und ich die vorhin abgewiesen habe: Ich hab es jetzt so gemacht, dass die Bilder immer die gleiche Größe haben. Geändert von McFarlane (27.08.2008 um 16:54 Uhr) |
|
||||
Oh, Du hast das Ganze ja in einer Tabelle (stimmt, hattest Du eingangs ja auch geschrieben). Dass da vert. al. klappt ist klar Aber eine Tabelle ist für diese Zwecke fehl am Platz, eine Liste wäre korrekt. Dann kannst Du in jedem li Bild und Text per vert. al. ausrichten (d.h. den Text am Bild, das jeweils die Zeilenhöhe bestimmt), egal wie hoch das Bild ist. Sofern es einzeilig ist, brauchst Du keinerlei Zusatz-Markup.
Schon klar, aber das kann nicht sein, also Testcase bauen & hochladen. Geändert von heiko_rs (27.08.2008 um 17:02 Uhr) |
Sponsored Links |
|
|||
ja, das konnte wirklich nicht sein.
hatte grad bemerkt, dass ich ein }; anstatt ;} im CSS stehen hatte was mir natürlich den Style zerlegt hat. Das eine Liste für das einzeilige Layout richtig wäre stimmt, aber ich werde noch mehr Spalten hinzufügen oder die Dateien mehrspaltig anzeigen lassen. Deshalb nehm ich (erstmal) ne Tabelle, da kann ich mich besser um den Skript kümmern. Vielen Dank für eure Hilfe |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Wachsende Container | Andy CD | CSS | 13 | 10.02.2010 14:08 |
Floats verschwinden im nichts, Fließer überdecken Floats. | nick | CSS | 5 | 09.02.2008 15:34 |
Falsche Darstellung beim Internet Explorer | LordAvalon | CSS | 4 | 09.04.2007 17:22 |
Problem: Überschrift <hx> innerhalb von Abschnitt <p> | Ares | CSS | 7 | 24.10.2006 14:30 |
bild über 2 div-tags positionieren | MoJo | CSS | 7 | 12.06.2006 17:48 |