定位文本在Firefox和Chrome上的顯示方式相同

我有一個包含一些文本框的網站。當我在Chrome瀏覽器中查看它時，它的權利在頂部，所以我已將padding-top css規則放置在Chrome上正確排列它的元素上，但在Firefox上，文本最初是正確居中的，並且css規則會將其廢棄。我怎麼編碼它（最好是沒有在服務器上的瀏覽器檢測器），以便它填充鉻中的文本，但不是在Firefox中？定位文本在Firefox和Chrome上的顯示方式相同

編輯：

.footer input[type="submit"] 
{ 
    border: none; 
    color: #FFFFFF; 
    font-size: 16px; 
    height: 35px; 
    padding: 9px 10px; 
    margin: 0px; 
}

來源

2012-07-25 topherg

不可能幫助沒有看到一些代碼。 – Turnip 2012-07-25 17:38:59

最好的解決方案是製作一個可靠的佈局，這會給你在Chrome和Firefox中的相同結果。如果你能向我們展示一個CSS和HTML的例子，它也會有所幫助:) – scumah 2012-07-25 17:39:02

-1

與此代碼修復它（至少暫時）

padding: 8px 10px 6px; 
-webkit-padding-after: 8px;

謝謝Roddy of the Frozen Pea爲webkit參考

來源

2012-07-25 18:01:35 topherg

我的建議是，你利用CSS reset刪除瀏覽器之間的差異。沒有看到具體的代碼，很難說這是否會100％解決你的問題。

來源

2012-07-25 17:50:41 ohiock

絕對會在未來使用該代碼，但可悲的是在這種情況下，它不起作用 – topherg 2012-07-25 17:56:32

使用[jsFiddle]（http://jsfiddle.net /）重新創建場景供我們查看和玩。 – ohiock 2012-07-25 17:59:08

如果只是您關心的那兩種瀏覽器，您可以添加專門針對Chrome的webkit特定CSS。因此，在您的示例中，Chrome需要額外的padding-top：-webkit-padding-before。這會將填充僅應用於webkit瀏覽器（Chrome，Safari等），而不適用於Firefox或IE或Opera。

然而，最好的辦法是應用CSS重置，然後對所有瀏覽器使用相同的樣式。如果這不是一個選項，那麼你可以像上面提到的那樣定位特定的引擎（webkit等）。然而，這並不是建議或被認爲是「最佳實踐」。

來源

2012-07-25 17:51:02

定位文本在Firefox和Chrome上的顯示方式相同

回答

相關問題