
IE7 Input background image scroll upon typing a long text
October 8, 2009As you probably already know having a background image on an input field is buggy in ie7.
When you type in a long text the image scrolls left …
Even if there are a lot of opinions regarding this issue on the web none worked for me as I wanted (cross-browser).
Here is my solution:
The CSS:
input#SearchInput {
border: 0;
width: 230px; /* Your background image width */
height: 22px; /* Your background image height */
line-height: 22px; /* Your background image height */
background:transparent; /* This is the trick */
}
#ieSuge {
background:url(/images/your_input_image.png) no-repeat left top;
height: 22px;
}
The HTML:
<div id="ieSuge"> <input id="SearchInput" type="text" /> </div>
Try it…
It works in ie6, ie7, FF,Chrome,Opera
If you find useful my solution leave me a comment!
Like always if i missed something just drop me some lines below

Ai ales un nume ‘intelept’ pentru wrapper LOL