Closed
Bug 1265643
Opened 10 years ago
Closed 10 years ago
Absolutely-positioned <body> background is overlapped by <html> background onscroll
Categories
(Core :: Web Painting, defect)
Core
Web Painting
Tracking
()
RESOLVED
INVALID
People
(Reporter: gerv, Unassigned)
Details
Attachments
(2 files)
earth-from-space.png
See attached testcase - view it, and then scroll down. The planet disappears behind the background of the <html> tag. This sure seems like a bug.
Gerv
|
Reporter | |
Comment 1•10 years ago
|
||
|
||
Comment 2•10 years ago
|
||
Behaviour is the same in Safari and Chrome.
I think I can explain the behaviour. I'm guessing that the overflow: auto on the body gets propagated to the html element, so the body gets made overflow: visible. The body element is the size of the viewport (minus padding). The background-attachment is fixed, which means we view the background image through the "porthole" of the body element, and the background image doesn't move. When you scroll up the body element scrolls up too, and so does the porthole that we are viewing the background through. If you give the body element a border you can see this.
If I missed somethign please re-open.
Status: NEW → RESOLVED
Closed: 10 years ago
Resolution: --- → INVALID
|
|
Reporter | |
Comment 3•10 years ago
|
||
Hi tnikkel: thanks for the explanation :-) I agree giving the body element a border shows that it scrolls up, and that's why you can't see it. But that makes no sense - it seems like loads of the text in the body element is rendered outside the body element's boundary. Why is that?
Removing the overflow: auto doesn't seem to change anything. Are you sure your explanation holds up?
Gerv
Status: RESOLVED → REOPENED
Resolution: INVALID → ---
|
|
||
Comment 4•10 years ago
|
||
(In reply to Gervase Markham [:gerv] from comment #3)
> Hi tnikkel: thanks for the explanation :-) I agree giving the body element a
> border shows that it scrolls up, and that's why you can't see it. But that
> makes no sense - it seems like loads of the text in the body element is
> rendered outside the body element's boundary. Why is that?
Once the overflow: auto is propagated away from the body element it becomes overflow: visible. What you described is how overflow: visible works. The contents of the element overflow outside the elements bounds and they are visible.
> Removing the overflow: auto doesn't seem to change anything. Are you sure
> your explanation holds up?
The body element is then overflow: visible (the default), and the html element is overflow: auto. The same as before. The propagation explains why the body element (in addition to the html element) isn't scrollable as one would expect with overflow: auto and overflowing contents.
|
|
||
Comment 5•10 years ago
|
||
If I missed something please re-open.
Status: REOPENED → RESOLVED
Closed: 10 years ago → 10 years ago
Resolution: --- → INVALID
|
Assignee | |
Updated•7 years ago
|
Component: Layout: View Rendering → Layout: Web Painting
You need to log in
before you can comment on or make changes to this bug.
Description
•