2013-05-06 157 views
0

我想給瀏覽器兼容性問題填充的CSS問題,瀏覽器兼容性問題

-webkit-padding-start: 4px 0px; //for google chrome 
-moz-padding-start: 3px 0px; //for Mozilla Firefox 
padding: 3px 0;     // others browser 

但結果差異填充是填充:3px的0;採取兩個瀏覽器。我需要區分它。

+2

這聽起來像是一個奇怪的請求,希望瀏覽器呈現不同。這是爲了彌補網頁上的其他問題嗎?如果是這樣,最好解決這個問題。 – 2013-05-06 13:18:25

+0

謝謝Lister先生和Guffa先生。我犯了兩個錯誤。結合兩個答案,css在兩個瀏覽器中都能正常工作。再次感謝你們倆。 – Rickyrock 2013-05-07 09:41:15

回答

1

如果可能,您應該嘗試在所有瀏覽器中使用相同的樣式。即使最初的工作多一點,它也會使維護更容易。也就是說,

padding-start樣式採用單個值,而不是兩個值。

例,語法-moz-padding-start

-moz-padding-start: <length> | <percentage> | inherit | auto; 

例子:

-moz-padding-start: 10px; 

編號:https://developer.mozilla.org/en-US/docs/CSS/-moz-padding-start

0

如果按照這個順序做,瀏覽器將使用最後聲明:中padding將覆蓋-webkit-padding-start。 因此切換聲明。

padding: 3px 0;     // other browsers 
-webkit-padding-start: 4px;  // for Google Chrome 
-moz-padding-start: 3px;  // for Mozilla Firefox 

然後-webkit-padding-start將覆蓋padding起始值。