Hi experts,
I have an html page with a background image that I want to repeat both vertically and horizontally. The background displays fine in most browsers (including IE6 and Firefox 2), but on IE7 it renders very slowly (you can actually see the image as it is repeated on the screen). The image is 1x3 pixels. This is my CSS style:
#main {
width:768px;
background-image: url('background_img.gif');
background-repeat: repeat-x, repeat-y;
}
Can anyone tell me if there is a known problem in IE7, or even better how to get around it?
Thanks.
This Question has been solved and asker verified All Experts Exchange premium technology solutions are available to subscription members.
Experts Exchange has been collecting answers to technology questions since 1996…3 million and counting! If you have a question, chances are we already have your answer.
If you can't find the exact answer you're looking for, ask our exclusive community of 50,000 experts. You’ll get a personalized answer from a trusted professional.
Thousands of free tech tips, tricks, how-to’s and tutorials are available in our peer reviewed articles section. See for yourself how smart our experts are, no login required.
Save solutions to your questions, answers you’ve discovered through searching plus helpful articles in your personal knowledgebase for easy future access.
Access the answers to your technology questions today.
30-day free trial. Register in 60 seconds.
Members of the expert community talk about why the experience at Experts Exchange is different than what you will find anywhere else.
Try it out and discover for yourself.
30-day free trial. Register in 60 seconds.
Join the community of experts here and help other tech pros by answering question in your area of expertise. You can earn FREE access to all Experts Exchange's premium features and resources.
I agree with TheKyle. I've done this too in the past (pre IE7), trying to create a background image that was only several pixels big, and I had the same problem with other browsers. I don't know why IE7 doesn't handle it as well as IE6 or FF, but imagine a Pentium 3 or even Pentium 2 computer. Maybe they have problems with this in all browsers.
Increase the canvas, not to 2x6, but to 20x60 or something. This is probably a GIF or preferably a PNG, and the increase in size won't be a big difference in download size.
You might try another image, with different colors. You might want to change the image format. Maybe GIF performs better than PNG or vv.
Business Accounts
Answer for Membership
by: TheKylePosted on 2007-10-02 at 11:20:09ID: 20000802
Can you increase the background size? 1x3 is extremely small, and means that the browser has to repeat it a lot more times. Even increasing the size to 2x6 would reduce the number of repeats in half.
I've had situations where increasing the size of a tiled background significantly reduced the loading time.