文本框背景图像推出在IE 6& IE 7 [英] Textbox background image pushing out in IE 6 & IE 7
问题描述
请参阅
这是一个互联网上的随机页面,与我同意: http://blogs.creative-jar.com/post/Input-backgrounds-scrolling-in- IE.aspx
如果您的网页大量使用JavaScript / jQuery,您可以使用它来应用修复,而不是混淆HTML。 p>
Please see this jsFiddle example. The background image I have used on textbox pushes out of view in IE when you type in long values:
Solution (in case jsfiddle gets deleted)
CSS
#txt_services_by_zip_code_search{
border: none;
float: left;
height: 22px;
width: 95px;
padding:0 5px;
background: transparent
}
#txt_services_by_zip_code_search_wrapper {
background: transparent url('http://i.imgur.com/quh2W.gif') no-repeat 0 -25px;
display: inline-block;
*display: inline;
zoom: 1
}
HTML
<div id="txt_services_by_zip_code_search_wrapper">
<input type="text" name="services_by_zip_code_search" id="txt_services_by_zip_code_search" class="txt_services_by_zip_code_search" />
</div>
A classic IE bug..
There is no clean workaround. You have to wrap the input in another element such as a div
, and apply the background
to that instead.
See in IE7: http://jsfiddle.net/P47sa/3/
Here's a random page on the Internet that agrees with me: http://blogs.creative-jar.com/post/Input-backgrounds-scrolling-in-IE.aspx
If your page makes heavy use of JavaScript/jQuery, you could use that to apply the fix instead of cluttering up the HTML.
这篇关于文本框背景图像推出在IE 6& IE 7的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!