Footer soll immer am Boden sein

Sniper_Kotaro · 23.11.2009, 09:38

Hallo!

Ich habe ein Problem mit meiner HTML/CSS-Einstellung.
Also, der Footer der Seite soll immer am Boden haften, egal wie groß die Seite ist.
Ist auch kein Problem, das klappt soweit, aber jetzt habe ich folgendes Problem:
Wenn ich die Seite kleiner mache, so klein wie möglich, dann läuft der Footer über den Content.
Und dieses Problem bekomm ich nicht in den Griff

Hier mein CSS-Code:

Code:

div#outterContainer {
width:800px;
margin:10px 0 0 10px;
}

div#header {
width:800px;
height:100px;
text-align:center;
}

div#menu {
width:100px;
float:left;
}

div#content {
width:700px;
float:right;
}

div#footer {
width:800px;
text-align:center;
position: absolute;
bottom: 5px;
}

Kurze Erklärung: Der outterContainer umschließt alle anderen DIVs, erst kommt der Header oben, darunter links das menu (Navi), rechts vom menu dann der content und unter dem content dann der footer.

Kann mir da jemand helfen bitte?

Tidus · 23.11.2009, 11:27

Code:

#footer{
 clear: both;
}

Sniper_Kotaro · 23.11.2009, 12:00

Hallo Tidus,

leider bringt diese Zeile keine Änderung bei mir rein

Der Footer "schwebt" noch immer über den anderen Divs, wenn ich das Fenster minimal klein mache.

Tidus · 23.11.2009, 13:22

Wo ist denn der Sinn, die Seite so klein wie möglich zu draggen ? Der Grund, warum dein Footer immer über deinen anderen Divs liegt, ist die Eigenschaft "position" mit dem Wert "absolute" .
Mir fällt grade leider nichts anderes ein, den Footer am Boden "kleben" zulassen, allerdings sehe ich auch nicht den Sinn das Fenster so klein wie möglich zu draggen. Kein Mensch schaut sich in dieser Form eine Internetseite an.

Sniper_Kotaro · 23.11.2009, 13:25

Da hast du bedingt Recht...
Was ist jetzt aber beispielsweise, wenn der Content 600px in der Höhe einnimmt und dann der User das Browserfenster auf eine Höhe von 400px verkleinert (warum auch immer er das tun würde).
Dann hinge der Footer über dem Content

Tidus · 23.11.2009, 13:49

Angenommen der User würde das wirklich tun, dann hat das sicherlich den Grund, dass er Platz auf seinem Desktop brauch, weil er was anderes machen möchte. Ist das der Fall, dann isses auch egal ob der Footer da nun rum schwebt oder nicht, sollte er wieder bedarf haben die Seite zu aktivieren, wird diese denke ich mal , eh wieder Maximiert.

Sniper_Kotaro · 23.11.2009, 14:54

Klar, das ist die Theorie

Aber ich sitze hier halt an nem Projekt, in dem das gefordert ist.
(Bin "Praktikant" in einer Webentwickler-Firma)

Tidus · 23.11.2009, 15:26

Dann frag deine Mitarbeiter mal, in was für einem Fall das vorkommen soll, das der User einer Seite das Browserfenster klein schiebt.

Sniper_Kotaro · 23.11.2009, 15:50

Ist halt wie gesagt nur nen Theorie-Fall.
Wir wissen ja alle, was es für DAUs da draußen gibt

Kann auch bestimmt irgendwelche Gründe geben, dass jemand das Fenster verkleinert..
Hier ist das halt nur ne ästhetische Sache

nikosch · 23.11.2009, 17:22

Ohne Deinen Code jetzt groß gelesen zu haben: Probier mal, dem Content-Bereich einen margin-bottom in Höhe des Footers zu verpassen.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Formmailer ?topic & ?action PHP	christian1988	PHP Tipps 2009	7	15.09.2009 13:57
Footer bild einfügen	shona91	PHP Tipps 2009	14	10.07.2009 12:36
Kirchenwebsite - Wie Header & Footer includieren	Stretch30	PHP Tipps 2009	11	13.06.2009 14:05
Firefox will mein 3-spaltiges Layout mit Footer nicht (CSS)!	vampsoftchef	HTML, Usability und Barrierefreiheit	1	28.02.2007 00:22
Select Feld Überlappungsproblem	andrew22	HTML, Usability und Barrierefreiheit	22	30.11.2006 10:44
Footer position fixed	andrew22	HTML, Usability und Barrierefreiheit	1	14.11.2006 16:00
footer ständig unten bei 2-Spaltigem Layout?	dethlef14	HTML, Usability und Barrierefreiheit	2	24.09.2006 21:53
klammern von header bis footer		PHP Tipps 2004-2	7	17.12.2004 13:02
Header & Footer definieren		PHP Tipps 2004	6	26.08.2004 17:19

23.11.2009, 09:38
Sniper_Kotaro Erfahrener Benutzer Registriert seit: 04.03.2009 Beiträge: 303 PHP-Kenntnisse: Anfänger	Footer soll immer am Boden sein Hallo! Ich habe ein Problem mit meiner HTML/CSS-Einstellung. Also, der Footer der Seite soll immer am Boden haften, egal wie groß die Seite ist. Ist auch kein Problem, das klappt soweit, aber jetzt habe ich folgendes Problem: Wenn ich die Seite kleiner mache, so klein wie möglich, dann läuft der Footer über den Content. Und dieses Problem bekomm ich nicht in den Griff Hier mein CSS-Code: Code: div#outterContainer { width:800px; margin:10px 0 0 10px; } div#header { width:800px; height:100px; text-align:center; } div#menu { width:100px; float:left; } div#content { width:700px; float:right; } div#footer { width:800px; text-align:center; position: absolute; bottom: 5px; } Kurze Erklärung: Der outterContainer umschließt alle anderen DIVs, erst kommt der Header oben, darunter links das menu (Navi), rechts vom menu dann der content und unter dem content dann der footer. Kann mir da jemand helfen bitte? __________________ Geändert von Sniper_Kotaro (23.11.2009 um 09:50 Uhr).


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

23.11.2009, 11:27
Tidus Benutzer Registriert seit: 20.11.2009 Beiträge: 91 PHP-Kenntnisse: Fortgeschritten	Code: #footer{ clear: both; }

23.11.2009, 12:00
Sniper_Kotaro Erfahrener Benutzer Registriert seit: 04.03.2009 Beiträge: 303 PHP-Kenntnisse: Anfänger	Hallo Tidus, leider bringt diese Zeile keine Änderung bei mir rein Der Footer "schwebt" noch immer über den anderen Divs, wenn ich das Fenster minimal klein mache. __________________

23.11.2009, 13:22
Tidus Benutzer Registriert seit: 20.11.2009 Beiträge: 91 PHP-Kenntnisse: Fortgeschritten	Wo ist denn der Sinn, die Seite so klein wie möglich zu draggen ? Der Grund, warum dein Footer immer über deinen anderen Divs liegt, ist die Eigenschaft "position" mit dem Wert "absolute" . Mir fällt grade leider nichts anderes ein, den Footer am Boden "kleben" zulassen, allerdings sehe ich auch nicht den Sinn das Fenster so klein wie möglich zu draggen. Kein Mensch schaut sich in dieser Form eine Internetseite an.

23.11.2009, 13:25
Sniper_Kotaro Erfahrener Benutzer Registriert seit: 04.03.2009 Beiträge: 303 PHP-Kenntnisse: Anfänger	Da hast du bedingt Recht... Was ist jetzt aber beispielsweise, wenn der Content 600px in der Höhe einnimmt und dann der User das Browserfenster auf eine Höhe von 400px verkleinert (warum auch immer er das tun würde). Dann hinge der Footer über dem Content __________________

23.11.2009, 13:49
Tidus Benutzer Registriert seit: 20.11.2009 Beiträge: 91 PHP-Kenntnisse: Fortgeschritten	Angenommen der User würde das wirklich tun, dann hat das sicherlich den Grund, dass er Platz auf seinem Desktop brauch, weil er was anderes machen möchte. Ist das der Fall, dann isses auch egal ob der Footer da nun rum schwebt oder nicht, sollte er wieder bedarf haben die Seite zu aktivieren, wird diese denke ich mal , eh wieder Maximiert.

23.11.2009, 14:54
Sniper_Kotaro Erfahrener Benutzer Registriert seit: 04.03.2009 Beiträge: 303 PHP-Kenntnisse: Anfänger	Klar, das ist die Theorie Aber ich sitze hier halt an nem Projekt, in dem das gefordert ist. (Bin "Praktikant" in einer Webentwickler-Firma) __________________

23.11.2009, 15:26
Tidus Benutzer Registriert seit: 20.11.2009 Beiträge: 91 PHP-Kenntnisse: Fortgeschritten	Dann frag deine Mitarbeiter mal, in was für einem Fall das vorkommen soll, das der User einer Seite das Browserfenster klein schiebt.

23.11.2009, 15:50
Sniper_Kotaro Erfahrener Benutzer Registriert seit: 04.03.2009 Beiträge: 303 PHP-Kenntnisse: Anfänger	Ist halt wie gesagt nur nen Theorie-Fall. Wir wissen ja alle, was es für DAUs da draußen gibt Kann auch bestimmt irgendwelche Gründe geben, dass jemand das Fenster verkleinert.. Hier ist das halt nur ne ästhetische Sache __________________

23.11.2009, 17:22
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Ohne Deinen Code jetzt groß gelesen zu haben: Probier mal, dem Content-Bereich einen margin-bottom in Höhe des Footers zu verpassen. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --