-1

http://www.coffeeproteindrink.com/method-athlete/

我正在尝试删除主包装器下方的开放空间,在 Firefox 中它显示大约 20px 的开放区域,主页上有一个垂直滚动条以便查看它。

在 IE 中有一个可见的 115px 区域,没有滚动条。

我的目标是让 main_wrap + 页脚与页面底部齐平,但我尝试的一切似乎都没有帮助。

#main_wrap {height: 390px;
background: url(images/content_back.png) repeat-y top left; 
margin: 0 0 0 240px;
opacity: .8;
position:absolute;
top:325px;
overflow: hidden;
}

#main
{position: relative;
width: 680px;
padding: 0 40px 5px 40px;
font: normal 12px Verdana, Arial, sans-serif;
line-height: 20px;
display: inline-block;
z-index: 2;
}

#footer
{ 
width: 680px;
padding: 25px 40px 0 0px;
font-size: 12px;
position: relative;
height: auto;
clear: both;
bottom:50px;}

我要完成的示例:http: //www.bio-genix.com/

感谢您的帮助,肯

4

1 回答 1

1

事实证明,您不需要粘页脚技术,因为您的背景图像会拉伸到屏幕上,这意味着您可以使用height: 100%它并且可靠地将其设置为全高。

所以,看到这一点,bottom: 0将继续工作#main_wrap。下一个难题是底部边缘的幻影60px左右是从哪里来的;最后,经过调整,确定overflow: hidden将隐藏由#main_wrap元素内的边距和填充产生的额外高度。

这就是最终的工作(h2修复修复的部分):

#main_wrap {
    position: absolute;
    height: 390px;
    bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
    overflow: hidden;
}
#main {
    padding-bottom: 0;
}
#main_wrap #main h2.section_title {
    margin: 20px 0 40px
}

http://jfcoder.com/test/methodsite.html

于 2012-07-01T00:28:28.640 回答