Question

我在页面中有header1 div，我希望在IE7和IE6中设置 position：fixed top和center。多分辨率。

我在css中使用此代码：

.page
{
width:900px;
    height:auto;
    margin:auto;
}
.header1
{
width: 500px;
height: 60px;
float: right;
position: fixed;
display: block;
z-index: 1100; 
margin: 0 50px 0 0;
}

html代码：

<div class="page">
<div class="header1"></div>
</div>

OR

.page
{
width:900px;
    height:auto;
    margin:auto;
}
.header1
{
width: 500px;
height: 60px;
float: right;
position: fixed;
display: block;
z-index: 1100; 
top: 0px;
    right: 0px; /*right: X px*/
    left: 0px; /*left: X px*/
}

html代码：

<div class="page">
<div class="header1"></div>
</div>

它在IE 8 +中工作，但不能在IE7和6中工作。

Answer 1

IE6不支持position:fixed。

IE7 确实支持它，但有bug。

最终，你将无法使用纯CSS来实现这一点。您可能能够使用javascript polyfill脚本使其工作，该脚本为较旧的IE版本添加了较新的浏览器功能。

我所知道的唯一包含此功能的polyfill脚本是ie7.js / ie8.js /ie9.js。此脚本为旧版IE添加了大量额外功能，包括position:fixed。它并不完美，但它可能只是为你做的伎俩。

希望有所帮助。

您可以在此处找到有关浏览器支持的更多信息：http://quirksmode.org/css/css2/

Answer 2

在页面顶部添加DocType标记

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Answer 3

我遇到了类似的问题但是尝试

.page
{
width:900px;
height:auto;
margin:auto;
padding:0pt

}

这可能会导致您使用更多的CSS以减少效果，IE6可能会出现问题。

Answer 4

position：fixed应该给父容器而不是子容器

这就是你要求的

.page
{
 width:100%;
 position: fixed;
 top: 0px;   

}
.header1
{
 width: 500px;
 margin: 0 auto;
 height: 60px;
}

Answer 5

我不担心IE 6或IE7，IE 8,9和＆amp; 10使用得更多，只有一部分互联网用户并不真正担心互联网，我们其他人都使用Firefox，Opera和Chrome。

如何在IE7和IE6中定位

5 个答案: