nicht angemeldet
Hi,
es ist nicht so einfach, man braucht dafuer ziemliech viel code, dass height auf allen Browsern funkt kann. Schau dir das mal an, auf deinen fall musst du footer rausnehmen:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>sticky footer</title>
<style type="text/css">
body, html{
font:11px Verdana, Arial, Helvetica, sans-serif;
color:#000;
background:#FFF;
height:100%;
padding:0;
margin:0;}
#page{
width:800px;
padding:0;
margin-top:0;
margin-right:auto;
margin-bottom:110px;
margin-left:auto;
position:relative;
top:0;
min-height:100%; /* For Modern Browsers */
height:auto !important; /* For Modern Browsers */
height:100%; /* For IE */ }
#header{
margin:0;
padding:0}
#cont{
margin:5px;
padding-bottom:160px;
height:auto !important;}
#footer{
width:100%;
margin:0;
padding:0;
position:absolute;
bottom: 0 !important;
bottom:-1px;
height:110px;}
#ib{
top:230px;
left:360px;
width:100%;
padding:0;
margin:0;
height:100px;
overflow:hidden; /*scroll*/
border:1px solid red;}
</style>
</head>
<body>
<div id="page" style="border:1px solid">
<div id="header" style="border:1px solid">
<p>header</p><p>header</p><p>header</p>
</div>
<div id="cont" style="border:1px solid">
<p>content</p>
<div id="ib">
<p>box box box box box box box box box box box box</p><p>box</p><p>box</p><p>box</p>
</div>
</div>
<div id="footer" style="border:1px solid">
<p>footer</p><p>footer</p><p>footer</p>
</div>
</div>
</body>
</html>