|
|||
Höhe von Bildern an Text-(DIV-)Höhe anpassen
Ein DIV mit Text und mit voreingestellter maximaler Breite (max-width) wird links gefloatet, drei Bilder werden rechts davon untereinander gefloated.
Die Höhe des DIVs mit Text kann je nach Viewport-Breite stark variieren, das Layout ist flexibel. HTML-Code:
[...] <style type="text/css"> div#text { float: left; width: 70%; max-width: 800px; } div#images { float: right; width: 30%; } div#images img { width: auto; height: 33.3%; max-width: 200px; max-height: 150px; } </style> [...] <div id="text"> Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test <div style="clear:both"></div> </div> <div id="images"> <img alt="" src="/images/test1.png"></img><br /> <img alt="" src="/images/test2.png"></img><br /> <img alt="" src="/images/test3.png"></img> <div style="clear:both"></div> </div> [...] Dies ist bei dem jetzigen Code leider nicht der Fall, die Bilder nehmen die voreingestellte, maximal mögliche Höhe (max-height) und die damit verbundene Breite (width: auto) ein. background-size (CSS3) kann aus Kompatibilitätsgründen leider nicht verwendet werden. Vielen Dank für eure Antworten im Voraus! Mit freundlichen Grüßen Inno Geändert von Innocentus (14.05.2012 um 23:55 Uhr) |
Sponsored Links |
Stichwörter |
anpassen, bilder, float, fluid, höhe, layout, max-width, text |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Fragen zu CSS und Joomla | DOKTOR | CSS | 2 | 23.05.2011 20:29 |
Text in div positionieren | KeithKeith | CSS | 1 | 16.05.2010 22:37 |
CSS Text nebeinander? | carstiee09 | CSS | 13 | 13.11.2009 20:18 |
Float und Clear | Earl of Green | CSS | 3 | 22.02.2009 19:48 |
Falsche Darstellung beim Internet Explorer | LordAvalon | CSS | 4 | 09.04.2007 17:22 |