Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Background image for my search box is moving when I type text into it in Internet Explorer -- must fix!

Posted on 2008-10-07
2
Medium Priority
?
598 Views
Last Modified: 2013-12-08
If you type enough text into my search box on this page (when viewing the page in IE 6 or 7 ...

http://www.sutrafitadventures.com/

... you'll notice that that the background image that I have specified for that text input box starts to scroll horizontally, .. which looks ridiculous.  This problem doesn't happen in Firefox, Safari, or Chrome.

Is there any way I can fix this?   Here is the CSS that I have in place for the search input field:

.searchfield {
      border:0px;
      background-image:url(../images/searchbox_bg.jpg);
      background-position:fixed;
      height:17px;
      width:86px;
      padding:0px;
      padding-left:65px;
      margin-top:5px;
      padding-top:3px;      
      }

Thanks in advance,
- Yvan
0
Comment
Question by:egoselfaxis
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 5

Accepted Solution

by:
Devario Johnson earned 2000 total points
ID: 22663914
Might I suggest going about this a different way by

1) making a DIV to hold the input form field for your search but set the image as the background of that Div.

then have your input text field to the right of the div (paadding-left) enough to show the search word.

that should kill your headache
0
 

Author Comment

by:egoselfaxis
ID: 22678703
Devarioj -- that was an excellent suggestion.  Thank you.

http://www.sutrafitadventures.com/

- Yvan
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

If you are a web developer, you would be aware of the <iframe> tag in HTML. The <iframe> stands for inline frame and is used to embed another document within the current HTML document. The embedded document could be even another website.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

650 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question