CSS-IE問題中的填充？

Question

我在寬度上有些麻煩。 在Chrome / Firefox中，它看起來與Internet Explorer中的有所不同。 在Internet Explorer中，它更大。 它是

.menu ul li{
    display:inline;
    padding-right:60px;
    margin:0;
} 

為什么？

.menu{
    background-color:#000;
    height:35px;
    padding-top:15px;
    color:#fff;
    font-size:18px;
}

.menu ul{
    padding:0; 
    margin:0;
    list-style-type:none;
}

.menu ul li{
    display:inline;
    padding-right:60px;
    margin:0;
}

.menu a:link{
    color:#fff;
}

.menu a:active{
    color:#fff;
}

.menu a:hover{
    color:#fff;
}

.menu a:visited{
    color:#fff;
}

我真的希望有人能提供幫助:)

Answer 1

IE計算填充為高度/寬度的一部分，其他瀏覽器將其解釋為高度/寬度加填充。 因此，請嘗試僅給出高度/寬度或填充/邊距。

Answer 2

如果您想將box的框模型與其他瀏覽器的框模型統一起來，則可以始終使用box-size CSS3屬性。 IE的較早版本不支持該功能，因此，最好在chrome，ff等中使用border-box，而不是對content使用content-box。 如需進一步閱讀，請點擊此處-http: //www.css3.info/preview/box-sizing/

Answer 3

因為即使您設置了字體樣式，不同的瀏覽器也具有不同的字體樣式。 類似地，即具有不同的正面尺寸。 因此您可以為IE編寫代碼。

此處的鏈接僅用於幫助特定CSS。

http://css-tricks.com/how-to-create-an-ie-only-stylesheet/