在文本框內填充內容在Internet Explorer中顯示不正確

我在---鏈接中刪除了一個頁面---在文本框內填充內容在Internet Explorer中顯示不正確

您可以在FF和IE（我有IE 9）中檢查它。在這裏你可以看到右上角的搜索框有一個填充（左：32px，右：72px）。填充在FF和Chrome中正常工作，但不在IE中。

什麼是可能的原因。

搜索框代碼 -

<form action=""> 
    <input type="text" name="search" id="search" /> 
    <input type="submit" id="button" value="" /> 
    </form>

CSS：

#search { 
    background:url(images/searchlens.jpg) no-repeat 0 0; 
    float:right; 
    width: 286px; 
    height:40px; 
    border:none; 
    padding-left: 32px; 
    padding-right:72px; 
}

來源

2012-01-26 Puneet Saini

我想你的意思是，當有在框中足夠的文字，不應用正確的填充和更多的文本輸入，即使左填充消失。這可以在下面的簡單文檔中可以觀察到：

<!doctype html> 
<title>input padding</title> 
<style> 
#search { 
    padding-left: 32px; 
    padding-right: 72px; 
    width: 286px; 
} 
</style> 
<input id=search value= 
"Hello cruel world of Internet Explorer, why don't I get padded as specified?">

如果有更多的字符輸入到禁區，甚至左填充消失。

似乎沒有任何良好的解決這個怪事。在對padding a text input in IE… possible?問題的回答中，已經提出了一些修正，並且他們可能在某些情況下有所幫助，但不是我的測試。

所以我建議通過包裝一個div元素內的input元素和設置div元素的背景和填充規避問題，讓裏面的input盒大多是無樣式和所有的滾動內部發生。

來源

2012-01-26 12:47:39

好的，我會嘗試這個併發布更新 –

我在你的答案中嘗試了鏈接，但我無法在答案中嘗試所有黑客之後讓代碼工作，但人們報告說它對他們有效。。 –

在文本框內填充內容在Internet Explorer中顯示不正確

回答

相關問題