nicht angemeldet
3-Zeilen Layout mit "Dehnungsfuge"
Hallo Forum,
ich möchte vom Tabellenlayout auf css-Design umsteigen. Allerdings klappt das nicht reibungslos:
Die Seite enthält 3 DIVs. Das erste hängt oben am Rand mit fester Höhe, das zweite hängt unten am Rand mit fester Höhe und das dritte in der Mitte soll den verbleibenden Platz immer ausfüllen. height=100% funktioniert schon mal nicht. Die drei sind im Moment absolut positioniert.
Wie ist hier weiter vorzugehen?
Gruß,
Felix
-
Hi Felix!
Wie ist hier weiter vorzugehen?
Zuerst einmal solltest deine Layoutvorstellungen komplett über Bord werfen und eine klar strukturierte Seite erschaffen.
_Danach_ kannst du dann positionieren und verschönern wie du lustig bist.
Zu deinem Problem: Eine height-Angabe in Prozent bezieht sich immer auf das nächsthöhere Elternelement, dem eine Höhe zugewiesen wurde.
MfG H☼psel
--
"It's amazing I won. I was running against peace, prosperity, and incumbency."
George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)-
Leider ist mir damit nicht konkret geholfen ;-)
Für Mozilla habe ich nun die Lösung gefunden, indem ich sowohl top als auch bottom des mittleren divs angebe. Leider versaut der IE diese Idee.
-
Hi Felix!
Leider ist mir damit nicht konkret geholfen ;-)
Ich finde, ich habe dir extrem wichtige Tipps gegeben.
Leider versaut der IE diese Idee.
Das ist auch allgemein bekannt. Ich muss auch ehrlich zugeben, dass ich keine Ahnung habe, ob es dafür einen Workaround gibt. :)
MfG H☼psel
--
"It's amazing I won. I was running against peace, prosperity, and incumbency."
George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)
-
-
-
Hi,»» Hallo Forum,
ich möchte vom Tabellenlayout auf css-Design umsteigen. Allerdings klappt das nicht reibungslos:
Die Seite enthält 3 DIVs. Das erste hängt oben am Rand mit fester Höhe, das zweite hängt unten am Rand mit fester Höhe und das dritte in der Mitte soll den verbleibenden Platz immer ausfüllen.
Hm. tricky.
Ggf kannst Du den mittleren Bereich nur simmulieren indem Du eine entsprechende Hintergrundgrafik verwendest, den Inhalt aber einfach an das obere Div anschliessen laesst.Ansonsten koennte eventuell ein relativ positioniertes 100% Div (min-height bei Gecko, height in CC's fuer IE) helfen, in dem Du das obere und untere Div absolut positionierst. Der eigentliche Inhalt steckt dann in Elementen, die nach open und unten ein padding oder margin aufweisen, dass der Hoehe des oberen und unteren Divs entspricht, so dass sein Inhalt nicht von diesen verdeckt wird.
Gruesse, Joachim
--
Am Ende wird alles gut. -
Hallo,
Die Seite enthält 3 DIVs. Das erste hängt oben am Rand mit fester Höhe, das zweite hängt unten am Rand mit fester Höhe und das dritte in der Mitte soll den verbleibenden Platz immer ausfüllen. height=100% funktioniert schon mal nicht. Die drei sind im Moment absolut positioniert.
Vielleicht hilft dir das Beispiel (auch Quelltext/CSS anschauen) weiter:
CSS Drei Spalten Layout mit Kopf und FussGrüsse
Cyx23