我有一个非常基本的网站(页眉、内容、页脚没有侧边栏或任何东西),问题是内容区域与页脚重叠。我已经尝试了所有粘性页脚修复(即 csstricks、ryanfait.com 和我在 google 上找到的其他一些以及这里的一些,但它们都不起作用
像往常一样,任何帮助都会受到赞赏
<body>
<div class="wrapper">
<div id="header">
</div>
<div id="content">
</div>
<div id="push">
</div>
</div>
<div id="footer">
</div>
</body>
* {
margin: 0;
}
html, body {
height: 100%;
}
#header{
background-image:url("Images/nav.jpg");
width:100%;
height:64px;
}
#content{
background:#ffffff;
height:592px;
width:798px;
position:absolute;
top:80px;
left:20%;
z-index:3;
-moz-box-shadow: 0px 0px 8px #000000; /* FF3.5+ */
-webkit-box-shadow: 0px 0px 8px #000000; /* Saf3.0+, Chrome */
box-shadow: 0px 0px 8px #000000; /* Opera 10.5, IE9, Chrome 10+ */
}
#wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -129px;
}
#footer, #push {
height: 129px;
}
#footer{
background-color:#292929;
width:100%;
}
为什么你的内容是绝对定位的?它似乎不需要,并且会导致您遇到的问题。删除它并制作页脚:
#footer {
position: fixed;
bottom: 0;
height: 80px;
}
http://jsfiddle.net/JyQxW/ http://jsfiddle.net/JyQxW/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)