代码之家 › 专栏 › 技术社区 › JiminyCricket

IE7+位置:固定Z索引滚动不工作

internet-explorer-6 internet-explorer-7 css

1

JiminyCricket · 技术社区 · 14 年前

嗨,我在页面顶部创建了一个固定的导航栏/标题,内容如下。在所有的浏览器上,如果我滚动页面,内容会进入固定位置的导航栏下,除了IE(没什么奇怪的),我该如何编辑CSS才能工作?

<div class="navbar" style="width:100%; position:fixed; left: 3px; top: 0px; z-index:1;">
blah blah blah navigation
</div>

<div class="content">
whats up, im the content and im really long so i need to scroll
</div>

下面是一个在大多数浏览器中都有效的行为示例,而不是世界上的IE。

http://myivyleaguer.com/media/satcenter.html

1 回复 | 直到 11 年前

1

2

CherryFlavourPez 14 年前

您正在强制IE进入Quirks模式,因为您尚未声明doctype( http://www.quirksmode.org/css/quirksmode.html )

如果添加此项:

 <!DOCTYPE html>

到HTML文档的最上面,那么position:fixed将按预期工作。这是HTML5 doctype,简称为short,可以完成任务。

为了使固定位置也能在IE6中工作,您需要将其添加到样式表中(我假设内联的东西只是为了测试):

* html .navbar { position: absolute; }

见此页( http://ryanfait.com/position-fixed-ie6/ )为了解释。