nicht angemeldet
Faux Columns Problem, container gleicher Höhe.
suitich bin (wiedermal) der Verzweiflung nahe bei einem css problem.
Hier ein Schema, dass die Sache illustrieren soll: 
A ist der Content Container der teilweise auch lange Texte beinhalten wird. B beinhaltet die Navi. Wie im Bild veranschaulicht soll der Container B über A liegen. Beide Container sind leicht transparent, haben schwarze border und liegen über einem großen Hintergrundbild. Um Die "Illusion", dass B über A liegt, zu erreichen muss ich im CSS Layout einen dritten container (C) floaten lassen der für die "überlappung" zuständig ist.
Frage: Ist es irgendwie möglich C an die jeweilige Höhe von A anzupassen ohne
-
die gängige faux columns methode mit einem hintergrundbild (ist nicht wirklich möglich weil das bild ja auf einer variablen höhe mit einem kleinen schwarzen border weitergehen müsste)
-
ohne javascript?
-
eine absolute positionierung übereinander fällt aufgrund der hintergrundtransparenz leider auch weg...
nach stundenlangem überlegen wollte ich mich erkundigen ob euch möglichkeiten zur lösung einfallen, ich kann nicht mehr.
eure
anna
-
- eine absolute positionierung übereinander fällt aufgrund der hintergrundtransparenz leider auch weg...
margin-top kennst du?
Ansonsten solltest du dich mit clearfixing beschäftigen.
-
- eine absolute positionierung übereinander fällt aufgrund der hintergrundtransparenz leider auch weg...
margin-top kennst du?
Ansonsten solltest du dich mit clearfixing beschäftigen.
naja margin-top und clearfixing sagen mir schon etwas, ich bin mir nur nicht sicher auf was du hinauswillst ...
-
naja margin-top und clearfixing sagen mir schon etwas, ich bin mir nur nicht sicher auf was du hinauswillst ...
Dass du das Menü nach rechts oben positionieren sollst und zwar absolut, die beiden anderen Spalten floaten nebeneinander, die rechte hat einen oberen Außenabstand der der Höhe der Naviation (die hoffentlich keine dynamische Länge hat) entspricht.
Um die umgebende Box auseinanderzuziehen erledigst du dann mit dem clearfix bzw. einen echten element, welches als Hintergrund die abschließenden Rahmenteile erhält.
-
naja margin-top und clearfixing sagen mir schon etwas, ich bin mir nur nicht sicher auf was du hinauswillst ...
Dass du das Menü nach rechts oben positionieren sollst und zwar absolut, die beiden anderen Spalten floaten nebeneinander, die rechte hat einen oberen Außenabstand der der Höhe der Naviation (die hoffentlich keine dynamische Länge hat) entspricht.
Um die umgebende Box auseinanderzuziehen erledigst du dann mit dem clearfix bzw. einen echten element, welches als Hintergrund die abschließenden Rahmenteile erhält.
erstmal danke für die erklärung. das ganze soll irgendwann ein drupal template werden, insofern hat die Navigation (B) (leider) eine dynamische höhe.
vielleicht präzisiere ich mich mal so:
im grunde suche ich eine faux columns methode wobei innerhalb einer spalte zwei container mit jeweils dynamischer höhe untereinander liegen.
container a gibt sozusagen die höhe vor. container c hat eine dynamische höhe und container d muss bottom immer auf selber höhe wie a sein.
ich hoffe ich drücke mich einigermaßen klar aus.
-
container a gibt sozusagen die höhe vor. container c hat eine dynamische höhe und container d muss bottom immer auf selber höhe wie a sein.
Dann verstehe ich dein Problem mit Faux Colums nicht - das ist das, was du suchst.
-
container a gibt sozusagen die höhe vor. container c hat eine dynamische höhe und container d muss bottom immer auf selber höhe wie a sein.
Dann verstehe ich dein Problem mit Faux Colums nicht - das ist das, was du suchst.
naja, sämtliche faux columns vorschläge arbeiten mit einem bgimage - das kann ich in meinem fall nicht, da die container alle transparent sind und über einem großen hintergrundbild vom body liegen bzw. 1px border haben.
wahrscheinlich hilft es nicht, aber noch ein screenshot, weil ich gerade tinypic kennengelernt habe: ;-)
-
naja, sämtliche faux columns vorschläge arbeiten mit einem bgimage - das kann ich in meinem fall nicht, da die container alle transparent sind und über einem großen hintergrundbild vom body liegen bzw. 1px border haben.
Ich kann dir trotz dem deinem Bild nicht folgen was da das Problem ist :)
Die untere Kante packst du in ein zusätzliches Element (E) rein, welches einerseits die Aufgabe des Clearfix übernimmt und zusätzlich die unter Kante der Hintergrundgrafik liefert.
<div>
<div>A</div>
<div>B
<div>C</div>
<div>D</div>
</div>
<div>E</div>
</div>wahrscheinlich hilft es nicht, aber noch ein screenshot, weil ich gerade tinypic kennengelernt habe: ;-)
Lerne bayimg kennen :)
-
-
-
-