Internet Explorer和CSS背景圖像不工作

可能重複：
Textbox background image pushing out in IE 6 & IE 7 Internet Explorer和CSS背景圖像不工作

我有一些CSS在Firefox，Chrome和其他瀏覽器工作正常，但其失敗在IE中呈現相同。

我在輸入字段上使用了這個CSS，並且它在所有瀏覽器中完美顯示 - 直到我在該字段中寫入。在Internet Explorer中，當我在字段末尾寫入時，背景會重複。這裏是我的代碼：

.web_contact_text 
{ 
position:relative; 
padding-left:10px; 
padding-right:10px; 
width:244px; 
height:65px; 
line-height:65px; 
margin-left:auto; 
margin-right:auto; 
margin-bottom:-3px; 
left:10px; 
background:transparent; 
background-image:url("imagenes/contactar/campo_back_text.png"); 
border:0px solid; 
font-family:Arial; 
font-size:18px; 
color:#000000; 
cursor:pointer; 
cursor:hand; 
} 



<input type="text" name="contactar_nombre" class="web_contact_text" value="Insertar Nombre" title="Insertar Nombre" onclick="this.value=''">

BAD

Bad version (IE)

確定在其他BROWNSERS

Good version (other browsers)

與背景圖像的問題it's時，您使用輸入字段，文本，當你寫入更多的這個輸入字段的大小時，這個東西只會在Internet Explorer中發生，當你寫入更多不尊重背景並且一直重複這個時候沒有修復背景不尊重

http://i40.tinypic.com/4vs187.png

來源

2012-09-26 Gerardo Guzmán Miro

哪個版本的IE？ – ysrb

IE 8，背景圖像在輸入時寫入更多的字段寬度，視爲 –

您可以在這裏看到的問題：http://i40.tinypic.com/4vs187.png –

嘗試增加：

background-repeat:no-repeat;

來源

2012-09-26 12:21:02 Liam

是不是'無重複' ？ –

是........................ :) – Liam

........... ;-) –

.web_contact_text 
{ 
    background: url(filename.jpg); 
    position: relative; 
}

有時候這將無法工作，那麼另一種解決辦法是分配一個寬度或高度以與背景圖像的元素。您可能不想分配高度或寬度，因此解決方案是爲Internet Explorer分配1％的高度。因爲IE解釋的高度最小高度此CSS規則不會影響外觀：

.web_contact_text 
{ 
    background: url(filename.jpg); 
    height: 1%; 
} 

html>body .web_contact_text 
{ 
    height: auto; 
}

的height: 1% CSS命令由height: auto CSS命令抵消。 Internet Explorer不明白html>body，所以通過在第二個CSS規則前面插入這個規則，整個CSS規則將被IE忽略。

來源：link

來源

2012-09-26 12:23:47

問題出現在背景圖片上，當您使用輸入字段，文本等時，當您寫入更多大小的圖片時，用作背景的圖片這個東西只發生在Internet Explorer中，實際上在IE 8.0中 –

@GerardoGuzmánMiro嘗試'background-size：100px 100px;'/ *給出所需的寬度和高度* /這可能工作。並且還有'background-repeat：no-repeat'。如果它不起作用，回覆我。 –

@GerardoGuzmánMiro問一下，你有沒有在HTML頁面的頂部聲明'<！DOCTYPE html>'？你可能知道這一點。 –

Internet Explorer和CSS背景圖像不工作

回答

相關問題