位置：Chrome和Firefox絕對不兼容

我的問題是這樣的：我有一個表格，我把這個放在當然是<input>。但是在所有輸入中，Chrome和Firefox之間的兼容性都存在一些問題。與Firefox相比，Chrome相比Chrome增加了2px。我要通過代碼。我該怎麼辦？在CSS中爲webkit和moz使用不同的值？這裏是我的HTML：位置：Chrome和Firefox絕對不兼容

這裏是CSS：

#contact_form1 #FirstName_container { 
    position:absolute; 
    left:152px; 
    top:12px; 
    z-index:5; 
}

我能做些什麼？非常感謝！

來源

2013-03-12 Manoel

你能準確地說出增加的是什麼嗎？我只能看到Chrome和FF之間的一個區別 - 它是佔位符的位置。 http://jsfiddle.net/RGZch/ – Morpheus 2013-03-12 13:45:39

您是否嘗試將邊距和填充設置爲0第一個 – 2013-03-12 13:47:00

Morpheus：與Firefox相比，Chrome似乎增加了2px。 sam_7_h：不，我會試試看。謝謝。 – Manoel 2013-03-12 13:52:53

把它放在你的CSS的頂部。

* 
{ 
    margin:0; 
    padding:0; 
}

這將使所有邊距和填充默認爲零。我將這添加到每個項目的開始，然後在需要時更改單個邊距或填充。

來源

2013-03-12 14:05:44 MiniRagnarok

MiniRagnarok：不工作。 :( – Manoel 2013-03-12 14:11:43

請大家看看問題，我計算了一下，我覺得，兩個像素的差別！ http://img607.imageshack.us/img607/4907/problemp.png – Manoel 2013-03-12 14:31:32

是的，我知道，我同意它是兩個像素的差異 – MiniRagnarok 2013-03-12 14:39:29

使用下面你給#FirstName_container的位置絕對：

#contact_form1 #FirstName_container { 
    position:absolute; 
    left:152px; 
    top:12px; 
    z-index:5; 
}

你應該給#FirstName_container的父母親戚和左，最高值的位置。這應該有助於解決此問題。

#contact_form1{position:relative;top:XXpx; left:XXpx;}

來源

2013-03-12 14:38:10 defau1t

但是這隻會移動整個表單的位置，其中2個像素的差異仍然存在 – Manoel 2013-03-12 14:46:43

而這個2像素的問題在所有的表單元素中都是這樣的 – Manoel 2013-03-12 14:53:29

-3

我設法解決了這個問題！只需在所有元素中添加margin: 0;即可。感謝大家幫助。

來源

2013-03-12 15:58:52 Manoel

Lol Lol Lol Lol Lol Lol Lol Lol – CENT1PEDE 2015-09-01 21:59:24

當使用span而不是絕對位置div創建時最常見的錯誤。如果您使用div元素，您通常會看到我的經驗更好地兼容所有瀏覽器。

來源

2014-04-04 07:42:34 batspy

位置：Chrome和Firefox絕對不兼容

回答

相關問題