页脚重叠

时间:2012-03-01 09:42:49

标签: jquery css footer

我正在使用jQuery菜单幻灯片,并且我的页脚存在一些问题。

当我放大时,我的页脚会覆盖我的所有其他内容。结果是,如果你以较小的分辨率看到网站,你将无法获得所有内容。

我尝试删除绝对位置,但页脚会移到屏幕顶部。

无论内容的高度如何,我都需要我的页脚始终在我的内容之下。

这个脚本可以吗?

网站:http://kennethkjaer.gofreeserve.com/

#footer { /* Footer container (whole browser width) */

background-image:url(../images/footer_bg.jpg);
bottom: 0;
position:absolute;
width: 100%;
height:85px;
padding-top:10px;
padding-bottom: 5px;

}     #footer_box {/ *带有som填充的中心页脚容器,以正确对齐内容* /         宽度:820px;         高度:30PX;         保证金:0px auto;         位置:相对;         填充:0px 10px 0px 10px;     }     #footercontent     {         宽度:360px;         身高:30px;         向左飘浮;         填充:0px;     }     #footerimg     {         宽度:100px;         身高:30px;         保证金:0px;         向左飘浮;     }

#footerimg p
{
    float: right;
    margin: 38px 0px 0px 0px; !important;
}

2 个答案:

答案 0 :(得分:2)

从你的问题我假设你不希望粘性页脚。

在这种情况下,导致问题的是position:absolutebottom:0。您告诉页脚始终坚持在底部(浏览器窗口的底部,而不是文档的底部),即使其他内容到达那里。因此,当您的网页上的其他内容到达浏览器窗口的底部时,页脚将覆盖它。如果你删除这个CSS,这将解决。如果HTML的页脚部分位于页面HTML的末尾,则它自然位于底部(文档)的底部,但您可能需要向下滚动才能看到它不再粘贴在浏览器窗口的底部。 请查看this website以供参考。我假设这是你想要的那种页脚。

答案 1 :(得分:1)

首先,我想说你的加价不好。根据您的要求,您可以使用粘性页脚方法

检查链接http://ryanfait.com/sticky-footer/