Footer am Seitenende ausrichten - wo ist der Fehler?

z0nk

Hallo erstmal,
Ich versuche seit geraumer Zeit auf http://kaergarden.square7.ch/spielkram/wordpress/ einen Footer im Layout unten an der Seite anzubringen.
Das klappt auch, solange die Seite nicht größer als 100% ist. Falls doch, ist allerdings mein Wrapper zu Ende (warum versteh ich leider nicht) und somit hängt mein Footer, der sich ja daran orientiert, irgendwo in der Mitte fest.
Wäre sehr nett wenn mir da jemand zeigen kann was ich falsch mache/wie ich das bestehende Layout so umbaue dass der Footer am Seitenende ist (nicht fixed!), egal wie lang der Text ist.
Der Footer ist übrigens das orange Teil (hab das ganze farblich markiert um Fehler leichter zu erkennen)

Vielen Dank im Voraus!

djheke

Nimm mal die width:100%; aus dem #container.

Die benötigte Angabe für IE6 bitte in einer separaten Datei einfügen.

Code

#container { width:100%; ]

Es scheint wohl so zu sein, dass die neueren Browser height:100% durch min-height:100% nicht mehr überschreiben. Ausgenommen Opera.

Also, alle Angaben für unsere Lieblingsbrowser mit Conditional Comments in einer separaten datei auslagern. So entstehen keine Probleme.

sejuma

Entferne bei #container

Code

height: 100%;

Ersetze bei .content

Code

position: absolute;
    left: 23%;
    top: 10%;

durch

Code

margin: 10% 0 0 23%;

z0nk

Vielen Dank erstmal für die Antworten!
Die Kombination aus beidem (also Auslagern des IE-Workarounds in ein extra Stylesheet plus Ersetzen der Content-Positionierungsattribute durch margin-Angaben) scheint soweit in sich zu funktionieren, allerdings hat sich nun mein #container (und somit auch der gesamte Inhalt) zusätzlich ein Stück nach unten verschoben... woran kann das liegen und wie beheb ichs?

EDIT: Ich seh grad dass die anderen Browser (hatte es eben unter Firefox getestet) da auch ziemlichen Schmu draus machen... Safari und Chrome lassen die Sidebar bis in den Header reinscrollen, IE8 tut das auch, verhackstückt ihn zusätzlich noch und hat entweder ein Problem mit der Anordnung via z-index oder hat mich bei der Containerdefinition falsch verstanden...

sejuma

Du verwendest sehr viele überflüssige absolute Positionierungen. Entferne diese generell und positioniere nur mit float und margin, den #footer und seinen Bezug ausgenommen.

Tags