Firefox和Chrome/Safari之間的Div pad-top差異

我正在網站上工作，我在申報CSS padding-top時遇到問題。Firefox和Chrome/Safari之間的Div pad-top差異

我的問題是填充在Firefox或Chrome瀏覽器中以不同的方式呈現。只要我將navbar div切換到position: fixed，我就會看到這個。

這與基本碼的jsfiddle其示出了該問題：http://jsfiddle.net/8puCW/3/

是否有保持固定頁眉/頂欄，並且不必在呈現差異導航欄的方法嗎？

謝謝。

來源

2014-06-09 Emanuele

不會將.main上的頂端樣式從45更改爲37修復此問題？ – j08691

你可以做一個CSS重置; '* {margin：0;填充：0; }' – TylerH

@ j08691不考慮那個白色條。嘗試用firefox打開jsfiddle，你會看到「菜單」以不同的方式定位（比「我的內容」更低）。 – Emanuele

由於您使用的位置是：固定的（http://www.w3schools.com/cssref/pr_class_position.asp）.navbar，擺脫填充頂部以放置元素並使用top屬性，如此小提琴所示：http://jsfiddle.net/8puCW/9/。我已經在FF Mac上測試過它，它是一致的。

.navbar { 
    position: fixed; 
    background: #D0D1D0; 
    float: left; 
    text-align: center; 
    top: 54px; /*UPDATE HERE*/ 
    width: 200px; 
    height: 100%; 
    padding-top:20px; /*UPDATE HERE*/ }

來源

2014-06-09 20:44:15

Firefox和Chrome/Safari之間的Div pad-top差異

回答

相關問題