IE沒有正確顯示頁腳和容器

-1

我正在以下網站上工作：buzzspherefilms.site40.net和頁腳在IE中沒有按預期顯示。它適用於Chrome和Mozilla，但在IE中，頁腳出現在頁面的底部。任何人都能看到爲什麼此外，任何幫助將這個腳本實現爲粘性頁腳都是非常好的。IE沒有正確顯示頁腳和容器

感謝

來源

2013-04-01 user1060187

此處的帖子相關代碼。 – Pavlo

簡短的回答是，你需要在#container調整margin-top。

在您的佈局中，您有兩個固定元素，分別爲header和navbar，組合高度分別爲120px和40px。

如果您在container上設置margin-top: 160px，則佈局將在整個瀏覽器中保持一致。

IE計算自動頂部邊距與其他瀏覽器不同，這會導致問題。

至於粘腳，網上有關於如何做的文章，所以這將是你的第一步。

jQuery的修復

您正在嘗試設置動態使用jQuery的container高度。跨瀏覽器問題的出現可能是因爲.outerHeight在IE中做了不同的數學運算。

先評論一下（以後可以放回）並嘗試一個簡單的CSS修復。

<script> 
    $(document).ready(function() { 
     $("#quickSearch").autocomplete({ 
     source: "quickSearch.php", 
     minLength: 2 
     }); 
      $('#container').css('marginTop', $('#header').outerHeight(true) + $('#navbar').outerHeight(true)); 

    }); 
</script>

來源

2013-04-01 19:10:12

嗨馬克，這沒有解決它在IE瀏覽器。 – user1060187

讓我仔細檢查一下，你使用的是什麼版本的IE以及什麼DOCTYPE？ –

給我幾分鐘，我會建立一個快速小提琴來說明，可能對別人有幫助。 –

你提到使用粘頁腳，但它並不像你正在使用它。這是允許你這樣做的CSS。（我只是複製和從網站上粘貼）

* { 
    margin: 0; 
} 
html, body { 
    height: 100%; 
} 
.wrapper { 
    min-height: 100%; 
    height: auto !important; 
    height: 100%; 
    margin: 0 auto -142px; /* the bottom margin is the negative value of the footer's height */ 
} 
.footer, .push { 
height: 142px; /* .push must be the same height as .footer */ 
}

源：http://ryanfait.com/sticky-footer/

來源

2013-04-01 19:08:01

IE沒有正確顯示頁腳和容器

回答

相關問題