nicht angemeldet
Bilder mit Text daneben in einem gefloateten Layout
Marc
1 0 Marc
Bilder mit Text daneben in einem gefloateten Layout
Marc
Hallo zusammen,
hier eine Nuss zum Knacken.
Ich möchte Text neben Bildern haben, wie folgt:
+---------+ Überschrift
| |
| | Text, Text, Text, Text, Text, Text, Text, Text
| |
+---------+
Der Text kann auch mal länger sein als das Bild, muss aber nicht.
Mein Ansatz (sicherlich der übliche): Bild links gefloatet, p und hx bekommen einen margin-left.
1. Problem (gelöst)
Ist der Text so kurz, dass er nicht die volle Höhe des Bildes einnimmt, wird das nächste Bild direkt unter dem Text und neben dem ersten Bild angezeigt. Also so:
+---------+ Überschrift
| |
| | Text, Text, Text, Text, Text, Text, Text, Text
| | +----------+
+---------+ | |
| |
| |
+----------+
Doof. Aber dafür gibt es ja clear. Also sorge ich damit dafür, dass die Bilder alle schön untereinander stehen. Ein Problem bleibt aber: In einem Layout, das bereits ein float:left für das Menü verwendet, bewirkt das clear, dass die Bilder erst unterhalb des Menüs angezeigt werden.
Die einzige Möglichkeit, die mir auf Anhieb einfällt: das Menü absolut zu positionieren. Das möchte ich aber gerne vermeiden. Geht das? Gibt es eine Lösung für ein Layout, das gefloatete Bereiche (Menü, rechte Marginalspalte) enthält?
Gerne benutze ich das folgende Grundlayout:
Viele Grüße,
Marc.
-
Die Lösung besteht darin, dem Textblock eine Höhe zu verpassen, die mindestens dem Bild entspricht (sofern dessen Größe bekannt ist) und overflow:visible zu setzen.
Andernfalls könntest Du Dein Glück mit position:relative probieren, aber der IE behandelt dieses in Verbindung mit float gelegentlich etwas widersprüchlich.
Gruß, LX
--
X-Self-Code: sh:( fo:) ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: Unusual
X-Please-Search-Archive-First: Absolutely Yes-
Hallo,
Die Lösung besteht darin, dem Textblock eine Höhe zu verpassen, die mindestens dem Bild entspricht (sofern dessen Größe bekannt ist) und overflow:visible zu setzen.
Dann benötige ich also ein weiteres DIV um die hx und p? - Schade, aber: Werde ich mal so versuchen.
Andernfalls könntest Du Dein Glück mit position:relative probieren, aber der IE behandelt dieses in Verbindung mit float gelegentlich etwas widersprüchlich.
Der siebener auch noch? Bisher schien der mir da nicht so anfällig zu sein, kann aber sein, dass ich da noch was nicht weiß...
Jedenfalls danke schon mal!
Viele Grüße,
Marc.
-