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位置：固定和邊距問題

回答

相關問題