|
|||
Problem mit float-Elementen: Footer überlagert Content
Hallo!
Das Layout, das ich erstellt habe, besteht im wesentlichen aus einer zentrierten Spalte, die sich über die gesamte Fensterhöhe erstreckt und aus einem Header-, Content- sowie einem Footer-Bereich zusammensetzt ist. (Den CSS-Code findet ihr hier.) Wenn ich nun im Content-Bereich zwei nebeneinander liegende Spalten mittels float: left definiere, verhält sich der Footer-Bereich, den ich mittels position: absolute und bottom: 0px immer am unteren Rand halten möchte, nicht wer wie gewünscht - er überlagert, wenn das Fenster gescrollt werden muss, Teile des Content-Bereichs... Sobald ich in der rechten Spalte des Content-Bereichs das float: left entferne, tritt dieser Überlagerungseffekt nicht mehr auf (Beispiel). Wie kommt das? Bzw. wie kann ich im Content-Bereich zwei Spalten definieren, so dass der Footer nicht verrückt spielt? Übrigens: Der Effekt tritt im IE nicht auf...!! Vielen Dank im voraus! | BB |
Sponsored Links |
|
|||
Du brauchst position:fixed; für richtige Browser und einen workaround für den IE, der das nicht kann (dafür aber position:absolute; so darstellt wie Du es gern hättest). Siehe u.a. auch
Fixed fuer IE6 Feste Positionierung: Die richtige Anwendung von position:fixed Fixing position:fixed for Windows Internet Explorer |
Sponsored Links |
|
|||
Das clear des Footer ist wirkungslos, da du ihn absolut positionierst.
Schau dir bitte Punkt 2 und 7 der FAQ an. edit: @mazzo: ich habe nicht den Eindruck, dass hier ein fixierter Footer gewünscht ist. |
|
|||
@mazzo: Danke für den Tipp, das muss ich mir mal ansehen!
@fricca: Mit dem clear hast du natürlich Recht. Aber der Footer soll schon in dem Sinne fixiert sein, dass er immer am untersten Fensterrand liegt - d.h. auch dann, wenn der Inhalt (inkl. Header) nicht die gesamte Fensterhöhe ausfüllt... Und wenn der Inhalt (inkl. Header) mehr als die gesamte Fensterhöhe ausfüllt, darf der Footer ruhig den Content-Bereich überlagern. Der Content-Bereich muss allerdings per Scrollen sichtbar gemacht werden können; im Moment überlagert der Footer einfach einen Teil des Content-Bereichs, Scrollen ist aber nicht möglich... Geändert von BabbleBoy (30.10.2006 um 10:29 Uhr) |
|
|||
ich dachte schon, so hab ich zunmindest das hier verstanden
Zitat:
|
|
|||
Zitat:
Wenn er -- wie bei deinem zweiten Beispiel -- unter dem Inhalt sitzen soll, dann ist es kein fixierter Footer. Dann brauchst du Punkt 7 der FAQ. |
|
|||
lol, ich war gedanklich nur entsprechend vorbehandelt. Vorletzte Woche hatte ich genau so ein Layout auszutüfteln.
|
Sponsored Links |
|
|||
Darf ich noch eine leicht unverschämte Frage stellen?
Nämlich: Gibt's die CSS-Dateien für die Beispiel-Page, auf die Punkt 7 der FAQ verweist, auch in abgespeckter Form - d.h. ohne all die Formatanweisungen für die Textinhalte? Denn so wie ich mich kenne, lösch ich aus den verlinkten CSS-Dateien main.css und product_features.css so viel raus, dass hinterher gar nichts mehr funktioniert...! |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Seite links ausrichten | like.no.other | CSS | 10 | 26.01.2011 02:10 |
Problem mit einem 3D-Effekt | moep0710 | CSS | 12 | 12.06.2010 15:30 |
Float und Clear von Elementen nur inerhalb eines Elements | theonlyrobi | CSS | 8 | 06.03.2008 22:44 |
Footer Problem | Xevi | CSS | 12 | 17.02.2008 15:48 |
Layout Problem (Head, Navi, Box, Content, Footer) | Al3x0r | CSS | 11 | 01.08.2006 15:07 |