Footer & Header sollen Fixiert bleiben....

tobm_knows_best

Erfahrenes Mitglied
Hallo zusammen,

ich habe jetzt schon so ziemlich alles versucht, um mir den Footer und den Header so zu fixieren, dass sie jeweils am entsprechenden Bildschrimrand "kleben" bleiben, und nur der Innenbereich scrollbar ist... - Leider vergebens....

Kann mir vielleicht jemand nen Tipp geben woran´s hier hapert... ?

Ich lege hier mal den Code mit bei:

HTML:
...

Gott - ich bin über jeden noch so kleinen Tip dankbar! :rolleyes:

Andernfalls fühle ich mich gezwungen auf Adobe´s Muse umzusteigen :/

edit: hat sich mit der folgender noch so simpler Variante über CSS geklärt:

CSS:
.header {position: fixed; top: 0px;}
.footer {position: fixed; bottom: 0px}

Um dann keinen Übersatz des Content-Divs zu haben, habe ich nur noch mit der "padding"-Variable ein wenig gespielt... und gut is... :)
 
Zuletzt bearbeitet:
So vielleicht
Code:
<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS FRAME</title>
<style type="text/css">
* {
 margin:0;
 padding:0;
}

html , body {
 height:100%;
 overflow:hidden;
}

#oben {
 height:100px;
 background:#eee;
}

#mitte {
 position:absolute;
 top:100px;
 left:0;
 right:0;
 bottom:100px;
 background:#dee;
 overflow:auto;
}

#unten {
 position:absolute;
 bottom:0;
 left:0;
 right:0;
 height:100px;
 background:#abb;
}

hr {
 padding: 50px 150px;
}

</style>
</head>
<body>
<div id="oben"><h1>Header</h1></div>

<div id="mitte">
 <h2>Inhaltsbereich</h2>
<hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr><hr>
</div>

<div id="unten"><h3>Footer</h3></div>

</div> 
</body>
</html>
</body>
</html>

@edit Hab dein Zusatz nicht gelesen.Sorry.
 

Neue Beiträge

Zurück