cancel
Showing results for 
Search instead for 
Did you mean: 

HTML background image stops being replicated in long page

Highlighted
New User

HTML background image stops being replicated in long page

This is a straight HTML (no JavaScript, no CSS) page with a tiled background image (128x128 pixel JPEG). After about 2/3 of the roughly 3,000 lines of this page the background image stops, with a smooth horizontal divide: the tiled image background above, and a white background below. The discontinuity moves up and down some while scrolling this page, but remains a clean horizontal break.

This is new behavior with Firefox 7. The background image was displayed throughout the full page with Firefox 6 and earlier.

13 REPLIES
New User

Re: HTML background image stops being replicated in long page

The background I am using is for the borders. It works on most my sales pages, but the one it stops short on is a very long one. I also have a problem with some that shows the background at the bottom before the footer graphics.

But I know it is FireFox because I tried the page in Internet Explorer and it worked fine. I guess I will just wait for a FF update as I don't find any way to overcome the problem other then take out my repeating background all together and code in a normal border.

MrSaveware

2011-11-24-05-11-24-eef670.jpg 2011-11-24-05-12-58-fcd779.jpg
New User

Re: HTML background image stops being replicated in long page

With Firefox 8 I've noticed that the divide between the first part of the page with the border and the remainder that just has a white background isn't always a full screen width; sometimes the break is just after a random tile.

Site Moderator

Re: HTML background image stops being replicated in long page

See [/questions/692350]

It should ofcource be Bug 692350.

  • bug 692350 Table background stops repeating after ~1600 lines
New User

Re: HTML background image stops being replicated in long page

I am using Firefox 12 and I have the same problem. I tested both straight HTML and CSS and it happens with both.


If I put in code as follows,


<style type="text/css"> body {background-image:url('blahblah.gif'); </style>

it looks fine in Internet Explorer, but in Firefox it stops halfway down the page. This is not a problem with coding, this is a bug and it needs a bug fix.

New User

Re: HTML background image stops being replicated in long page

I have same problem in Firefox. No problem in IE or Chrome. Definite bug. Just showed up in Rel 11 and 12 for me. Older worked fine.

SUMO Contributor

Re: HTML background image stops being replicated in long page

Hi Bluejay and vestibule, can you post URLs for the affected pages so volunteers can have a look? Or, if the heavy end-user support traffic here delays responses, you could try the mozillaZine Web Development board. Separate forum, separate registration. Please note the tips in the Sticky Post at the top of the forum before posting.

Site Moderator

Re: HTML background image stops being replicated in long page

I hadn't noticed that I posted a link to a question instead of the Bug with the same number.

  • bug 692350 Table background stops repeating after ~1600 lines
New User

Re: HTML background image stops being replicated in long page

Problem with Background repeat Here is link to home page that is long and has the problem.

All long pages have same problem: here is another http://www.hallvworthington.com/waiting.html

They all have the same coding: body { background-image: url(../Image_Files/parchmnt.jpg);

}

I've tried all the suggested coding changes I could find on the web - no luck.

Any solution would be appreciated, particularly by the users of Firefox.

SUMO Contributor

Re: HTML background image stops being replicated in long page

Hi vestibule, the home page renders out to 42072.5px tall, and Firefox has a bug that limits backgrounds to a height of approximately 32735px tall. See Bug 671302 – cairo-gdi: large background-images and gradients don't work beyond ~ 32735px.

This bug is coming up on a year old and for some reason hasn't been fixed yet, perhaps because such long pages are relatively rare on the web. ??

Until that is resolved, to make the "transition" less jarring, you can add a matching background color (this is the closest I can come up with at the moment):


body { background-image: url(Image_Files/parchmnt.jpg); background-color: #f8f8d4; }