✔ footer mag nicht unten bleiben

[KeDaiv]

Hi, ich habe ein großes Problem bei dem erstellen einer Webseite.
Das ist dann meine Webseite. http://www.root-online.de/. Wie ihr seht, ist der steht der Footer so ein bisschen in der Luft.
Ich jedoch würde es gerne so haben, dass der Footer am Boden des Browsers steht und auch die schwarzen Linien des Main Containers sollten eigentlich dann auch bis auf den footer reichen.
Nun noch ein paar kleine Bedingungen, die ich mir selber gestellt habe.
Ich wollte den HTML - , JS - und CSS-Code so gut wie möglich trennen. Und würd ich nich soo gerne Sachen über die Bildschirmauflöszng und alles auslesen, um dies zu realisieren.
Auch sollte es CSS3 Valide sein und XHTML 1.0 Strict.

Das wäre denn da so alles. Es wäre nett, wenn ihr mir da helfen könntet! ^^
mfg
KeDaiv

 

[Maik]

Hi,

ich denke, dass dir da meine angehängten Beispiele in meinem CSS-Tutorial CSS-Layout mit 100%-Höhe weiterhelfen, und sie deine Bedingungen erfüllen

mfg Maik

 

[KeDaiv]

Hi,
Danke für den Tipp, werde ich heute abend mal gleich ausprobieren, wenn ich weg von der Arbeit bin.
Kann leider erst montag zurück schreiben, ob das nu denn auch alles klappt!
Aber zumindest hört sich das schon mal viel versprechend an! ^^
Danke für dies! ^^

 

[KeDaiv]

Danke nochmal!
Das klappt nun alles wie am Schnürchen. Aber da ich zu Hause nur SelfHTML hab und kein eNet hab ich nochmal schnell ne Frage...
Wozu ist dieses "!important" und das ".clearfix"
Aus deren Bedeutung werde ich nicht so recht schlau... -.-

 

[Maik]

Hi,

min-height: 100%; /* Mindesthöhe in modernen Browsern */
height: auto !important; /* !important-Regel für moderne Browser */
height: 100%; /* Mindesthöhe in IE (<7) */

da der IE <7 die min-height-Eigenschaft nicht interpretiert, dafür aber die height-Eigenschaft als Mindesthöhe für ein Element behandelt, wird in der obigen Regel zunächst in den standardkonformen Browser die Mindesthöhe eingerichtet und mit der !important-Regel dafür gesorgt, dass sie die nachfolgende gleichlautende height-Deklaration ignorieren.

Mit der .clearfix-Klasse wird in meinem Beispiel die dreispaltige Floatumgebung zum Schluß aufgehoben, und so im Dokument wieder der normale Textfluss hergestellt.

mfg Maik