ccs problems in page causing only background image to be shown




17 years ago
17 years ago


(Reporter: jason, Assigned: attinasi)




Firefox Tracking Flags

(Not tracked)




(1 attachment)



17 years ago
From Bugzilla Helper:
User-Agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:0.9.4) Gecko/20010913
BuildID:    2001091311

if the page uses 
body {background-image: url(/images/bg.gif); overflow:auto;}
the page does not load. it gives a blank screen

But if the page uses
body {background-image: url(/images/bg.gif);}
the page at least loads.

Reproducible: Always
Steps to Reproduce:
1.use overflow:auto in body ccs

Actual Results:  You get a blank page

Expected Results:  The page will display

Comment 1

17 years ago
Created attachment 50566 [details]
Testcase with overflow:auto and background-image - works OK

Comment 2

17 years ago
I've attached a testcase with overflow:auto and background-image: url(...) and
it works fine for me. The original URL at does not work,
however. Possibly something else on that page?

Comment 3

17 years ago
I'm not sure what is wrong, but if I remove any of the linked stylesheets, or
the inline style block, then the page renders (not well, but it shows up). Also,
if I add to the top of the inline style block the following rule:

body {background-image: url(/images/bg.gif); overflow:scroll;}

Then there appears a tiny little are surrounded by scrollbars - about an inch
high and the width of the viewport. Some serious reduction is needed here, there
are a lot of rules to sift through.

Updating summary to reflect the know state of the problem more accurately.
Ever confirmed: true
Keywords: qawanted
Summary: ccs definition causes a blank page. → ccs problems in page causing only background image to be shown

Comment 4

17 years ago

I did not write any of this HTML.

I just want our homepage to load and have been fighting
with our web people who use IE (ick) on this problem and how
to fix it so it loads on Mozilla.

This is how I pinpointed the problem?
I took our homepage content and striped it down using the file: startup page.
Then I saved that page and directed the css links on that page to
a file.
        <link href="./header.css" rel="stylesheet" type="text/css">
        <link href="./concord.css" rel="stylesheet" type="text/css">

Inside that file concord.css,
/*body {background-image: url(/images/bg_test.gif); overflow:auto;}*/
body {background-image: url(/images/bg.gif);}
So I think its in that line somehow?

It loads if I take out the overflow:auto but not if I leave it in.
Thanks for Mozilla! I use it everyday... Awesome stuff!
We have some screen shots with it also...

The page uses position:absolute for everything.  This means that all those
blocks are taken out of normal flow and do not affect the size of their parents...

Now, the body has no size set.  So it auto-sizes.  Since it has no children to
affect its size, it becomes fairly small.

Now the body is small and you set overflow:auto.  Since the body has no normal
flow content to scroll to, there are no scrollbars.  Overflowing content is not
shown, since overflow is not visible.  All your content is overflowing....

So the simple solution is to change overflow:auto to overflow:visible for body.

Is there a reason that rule is there in the first place?
This is invalid -- we're rendering this correctly per css2 and the page is
depending on an IE bug.  If you wish, reopen and reassign to evangelism.
Last Resolved: 17 years ago
QA Contact: petersen → ian
Resolution: --- → INVALID

Comment 6

17 years ago
Hmmm. I wonder if we have a quirk to worry about here... that is a quirk
doctype. I doubt that there are a lot of pages that have this problem though. 
You need to log in before you can comment on or make changes to this bug.