IE7位置：固定和边距问题

我现在有一个HTML设置看起来像：IE7位置：固定和边距问题

<section class="topBar">The site's permanent top bar</section> 
<header class="body">Some header info here</header>

而且一个CSS设置，如：

.body { clear: both; margin: 0 auto; width: 600px; } 

header { 
height: 46px; 
margin: 30px auto 20px auto; 
} 

.topBar { 
position: fixed; 
top: 0; 
left: 0; 
width: 100%; 
z-index: 999; 
}

的目标是有顶栏留在页面的顶部，以及页眉之后的所有内容。

大部分工作正常。问题在于，只要topBar具有position：fixed（所以当页面加载时，header几乎隐藏在topBar下方）时，该页眉的顶部页边距会被忽略。

我试着将margin从顶端改为顶端，这也没有帮助。

如何解决被忽略的边缘顶部问题？

这里实际上是一个bug报告，测试页，显示问题：

错误报告：http://www.quirksmode.org/bugreports/archives/2007/03/ie7_positionfixed_and_margin_top_bug.html

测试页：http://feragnoli.com/ie7/

来源

2011-08-21 MrQuidam

添加填充顶：250像素的身体标记，并从.lower div中删除margin-top

来源

2011-08-22 00:07:23 Emil

非常感谢！我没有完全遵循，但我确实使用了填充顶部。我最终添加了！padding-top：30px到标题 – MrQuidam

将SECTION.topBar放在HEADER.body下：

<header class="body">Some header info here</header> 
<section class="topBar">The site's permanent top bar</section>

自SECTION.topBar已经固定的位置，所以在文档中的顺序不应该是想象中的那么重要......

我昨天刚遇到了同样的问题，所以上面的解决办法是什么我在做我的发展，因为这是一个很长时间以前提出的问题，所以你已经找到了一个很好的解决方案，告诉我怎么样！

来源

2013-04-20 08:06:20 Lien

IE7位置：固定和边距问题

回答

相关问题