nicht angemeldet
Re!
http://alistapart.com/articles/footers sagt eigentlich alles, was dazu zu sagen ist.
Wer die Seite nicht kennt ist klar im Nachteil, danke dafür!
Jetzt bleibt sich nur noch ein Problem: #mid_content versteht die height:100%; immer noch nicht.
[code=html]
html, body { height:100%; }
#mid_content {
width:100%;
height:100%;
padding-bottom:50px;
/*Die Grafik muss sich bis runter zum footer ziehen*/
background:url(./gfx/mid_content.jpg) top left repeat-y;
}
#footer {
position:absolute;
left:0; bottom:0;
width:100%;
height:34px;
}
#text {
position:relative;
top:50px; left:115px;
}
<!-- dank diesem container ist der Viewport der Seite immer mindestens 100% un der Footer wandert beim morphen mit -->
<div style="position:relative; min-height:100%;">
<!-- #mid_content muss sich von ganz oben bis runter zum footer ziehen, tut er aber nicht :-( -->
<div id="mid_content">
<div id="header"></div>
<div id="text"></div>
</div>
<div id="footer"></div>
</div>
[/code]
So far, the height of the container is determined by the height of the content block, which is cool if there is enough content to fill the height of the browser window (also called the viewport). If this is not the case you want the footer to stick to the bottom of the browser window.
Okay, schön und gut. Was bringts mir aber wenn der Footer schön unten klebt, der Content aber nicht die 100% höhe des Viewports übernimmt sondern eben nur so hoch wie der #text Container ist? In meinm Fall nichts, denn das zerstört mein Layout.
Ich habe versucht #mid_content mit "position:absolute; bottom:0;" zu versehen, hat auch ganz toll funtkoiniert...
Schade nur, dass "absolutely positioned elements are taken out of the normal flow and are placed over normal flowed elements." und der #text bei überlänge somit unter dem Footer durchgeschoben wird.
Thx so far, Listapart ist wirklich spitzenklasse! :-)
Gruß, Asto.