309755 - CSS @Media print overprinting areas with overflow:fixed changed to overflow:visible

Status: RESOLVED INVALID

(Core :: Printing: Output, defect)

Description

[ianbd]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-GB; rv:1.7.10) Gecko/20050717 Firefox/1.0.6
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-GB; rv:1.7.10) Gecko/20050717 Firefox/1.0.6

I have a long html page split into three sections, top and bottom of the page
and a scrolling section in the middle. In order to make this print, I have used
the @media print CSS option.

Print preview almost manages to display correctly (the final section of the page
was overprinting some of the middle scrolling section of the page)

When printing, only the first paper page was printed with the final 20% or so of
the middle scrolling section and the final non-scrolling section of the page
overprinting the content of the middle section.

Reproducible: Always

Steps to Reproduce:
1. create a page with the three sections details above
2. view page in print preview
3. try printing.
Actual Results:  
I did not get the full page printed, and the final section, plus some other
content, over-printed the central section.

Expected Results:  
printed the full document in the section order (ie, header, middle content, footer)

Comment 1

[Nickolay_Ponomarev]

Please attach a testcase (read
http://www.mozilla.org/newlayout/bugathon.html#testcase , starting at point 5).

Also, please test if this happens in 1.5 beta, the rendering engine of 1.0.x is
more than a year old.

Comment 2

[ianbd]

Attachment: HTML page plus supporting files in zip archive

I have attached a winzip file with a test page and the supporting files.
When I tried this page in firefox 1.5 beta there was no difference in printed
matter, that is the footer on the page appears just above the Notes heading in
the main body of the text.

Comment 3

[Nickolay_Ponomarev]

That still doesn't look like a minimal testcase (is the JS file needed? Does the
fact that some rules are in @media actually matters?), but thanks anyways..

Comment 4

[Marcus Furlong]

I have the same problem, different results. I changed to overflow:auto in the hope it would work as it does on-screen and resolve the problem of the overlapping page sections. Instead firefox hangs completely when I try a print preview. Reproduced many times without fail.

Mozilla/5.0 (X11; U; Linux i686; en-GB; rv:1.8.0.1) Gecko/20060331 Firefox/1.5.0.1

Comment 5

[Boris Zbarsky [:bzbarsky]]

> the final section of the page was overprinting some of the middle scrolling
> section of the page

That's because your JS sets a too-small height on the div with id "ySR".  This style rule is present in printing too, of course, and overrides the yesScroll styles (per CSS spec).  If you set the height on that div to "100% !important" in your print media style it should work.

The issue when printing is caused by the same thing.