zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Höhe von Bildern an Text-(DIV-)Höhe anpassen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 14.05.2012, 23:41
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 28.06.2007
Beiträge: 31
Innocentus befindet sich auf einem aufstrebenden Ast
Pfeil 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>
[...]
Nun soll sich die Höhe der Bilder gleichmäßig an die Höhe des links nebenstehenden DIVs anpassen.
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)
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
anpassen, bilder, float, fluid, höhe, layout, max-width, text

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ä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


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:57 Uhr.