Question

我遇到了一个相当奇怪的问题：

在我正在创建的其中一个网站上，我使用粘性页脚，在Firefox，Chrome，Safari和IE 9中运行良好。

它实际上也适用于IE 8，但仅限于通过同一站点的其他页面的链接访问该站点时。当直接访问网站（或重新加载）时，页脚不显示在页面的末尾，而是高于它，与内容重叠。

如果我点击在灯箱中打开的页面上的图片，页脚会以某种方式移回到所需的位置。

当我在本地环境中查看网站时，页脚也能正常工作，问题只出现在生产网络服务器（或我上传到的任何其他在线空间）上。

以下是相关的页脚代码，如果您需要更多，请告诉我（遗憾的是我无法访问该网站）：

HTML：

<!DOCTYPE html>
<html>
    <head>
       <link href="css/screen.css" media="screen, projection" rel="stylesheet" type="text/css" />
    </head>
    <body>
     <div class="wrapper">
         <div class="content">
             <!-- Content etc goes here -->
         </div>
         <div class="push"></div>
     </div>
     <div class="footer">
         <!-- Footer goes here -->
     </div>
    </body>
 </html>

CSS：

html, body {
    height: 100%;
}

div.wrapper {
    width: 960px;
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -154px;
}

div.push {
    height: 154px;
}

div.footer {
    position: relative;
    width: 960px;
    height: 154px;
    margin: 0 auto 0 auto;
    clear: both;
    overflow: hidden;
}

我感谢任何帮助，告诉我你是否需要更多信息，或者我是否遗漏了什么。

干杯，亚历

Answer 1

可能是一个布局问题。试试

.footer {zoom: 1;}

IE 8中的粘性页脚仅在直接访问页面后才与内容重叠

1 个答案: