keine Chance bei verschachtelten floats?
Felix Riesterer
keine Chance bei verschachtelten floats?
Felix Riesterer
Liebe Selfer,
ich habe "verschachtelte" floats, innerhalb derer ich mit clear Überlappungen verhindern will. Aber mein Ziel erreiche ich nicht. Nach dem Studium einiger Archiv-Beiträge komme ich zu dem Schluss, dass mein Vorhaben konzeptbedingt wohl nicht realisierbar ist.
Zur Problembeschreibung:
+----------------------------------------------+
| div "inhalt" |
|+---------------------+ +--------------------+|
|| div "foo" | | div "bar" ||
||Überschrift | | (float:right) ||
||Text mit Bild +-----+| |+------------------+||
||das floatet. |Bild1|| || div |||
|| | || || |||
||Überschrift | || |+------------------+||
||+-----+ Noch +-----+| |+------------------+||
|||Bld2 | ein Text mit | || div |||
||| | floatendem | || |||
||| | Bild. | || |||
||+-----+ | |+------------------+||
||Überschrift | +--------------------+|
||Schon wieder ein | |
||Text. Aber das Bild | |
||wird von der Über- | |
||schrift "unterlau- | |
||fen"! | |
++---------------------+ |
+----------------------------------------------+
Die Bilder im div "foo" floaten sowohl rechts, als auch links. Wenn ich als Abschluss eines "Kapitels" mit der Überschrift des folgenden eine neue Zeile _ohne_ herunterhängendem Bild aus dem Vorkapitel erreichen möchte, dann muss ich der Überschrift ein clear spendieren, da sonst das floatende Bild über dem neuen Bereich weiterschwimmt. Aber die clear-Rule (clear: right) stört das große div "bar", das auch rechts floatet. Eine solche Überschrift in "foo" würde bewirken, dass der sämtliche Anzeigebereich in "foo" nach unten ausgeweitet wird, so dass die clearende Überschrift unterhalb des "bar"-Divs landet, und das "zerschießt" mein Layout. Ein clear:left stört nicht das "bar"-Div. Ein links floatendes Bild in "foo" kann ich "aushebeln". Aber gegen ein rechts floatendes Bild scheint in meinem Konzept keine Möglichkeit zu existieren...
Weiß jemand Rat? Ich wäre überglücklich! ich probiere bei dieser Hitze schon seit Stunden herum...
Liebe Grüße aus Ellwangen,
Felix Riesterer.
-
-
Liebe Selfer,
Auf dieser Seite kann man das Ganze in Aktion sehen.
Der IE6 (wen wundert's?) zeigt es bei clear:both so an, wie gewünscht... Aber Firefox und Opera verhalten sich identisch zueinander und verrutschen die komplette Anzeige nach unten.
Liebe Grüße aus Ellwangen,
Felix Riesterer.
-
-
hi,
Die Bilder im div "foo" floaten sowohl rechts, als auch links. Wenn ich als Abschluss eines "Kapitels" mit der Überschrift des folgenden eine neue Zeile _ohne_ herunterhängendem Bild aus dem Vorkapitel erreichen möchte, dann muss ich
... die <dd> ebenfalls floaten, und ihnen eine breite von 100% spendieren. (in welche richtung sie gefloatet werden, scheint egal zu sein; float:left tut's für alle drei.)
also:
dl.linksbuendig dd { float:right; width:100%; }
und ggf. spendierst du der <dl> selber dann auch noch ein float, da sonst ihr rahmen nicht ordentlich "mitwächst" (zumindest in firefox und opera):
dl.linksbuendig { float:left; }
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Lieber wahsaga,
... die <dd> ebenfalls floaten, und ihnen eine breite von 100% spendieren. (in welche richtung sie gefloatet werden, scheint egal zu sein; float:left tut's für alle drei.)
also:
dl.linksbuendig dd { float:right; width:100%; }
und ggf. spendierst du der <dl> selber dann auch noch ein float, da sonst ihr rahmen nicht ordentlich "mitwächst" (zumindest in firefox und opera):
dl.linksbuendig { float:left; }
Wow, Du musst Dich da eben echt reingekniet haben! Ich werde das _sofort_ ausprobieren und dazulernen. Ich bin ganz schwer beeindruckt!
DANKE! DU BIST SUPER! ES KLAPPT!
Liebe Grüße aus Ellwangen,
Felix Riesterer.
-