CSS "position: fixed" does not work for print media
CSS2 (https://drafts.csswg.org/css2/visuren.html#propdef-position) defines the following behavior for "position: fixed" specifically for print media:
In the case of the print media type, the box is rendered on every page, and is fixed with respect to the page box, even if the page is seen through a viewport (in the case of a print-preview, for example).
However, this does not work in Safari at all, which means that creating a simple footer for every single page of printed output does not work. This works fine in other browsers.
Example code:
<html lang="en">
<head>
<title>Printed Position Bug Demo</title>
<style type="text/css">
.page-break {
page-break-before: always;
}
.printfooter {
display: none;
}
@media print {
.printfooter {
display: block;
text-align: center;
width: 100%;
/*
By setting the position to fixed and adding a bottom, the footer will be forced to the bottom of the page, and it is supposed to automatically
print on every page.
*/
position: fixed;
bottom: 42px;
}
button {
display: none;
}
}
</style>
</head>
<body>
<div class="printfooter">This is a footer for the bottom of every printed page.</div>
<div>Page 1 content</div>
<div class="page-break">Page 2 content</div>
<div class="page-break">Page 3 content</div>
<br>
<button onclick="window.print();">Open print dialog</button>
</body>
</html>
The outcome should be that one the screen, it shows
Page 1 content
Page 2 content
Page 3 content
(button) Open print dialog
And when printed, 3 pages should appear each with their corresponding "Page X content" and the same footer in the bottom center of every page.
How do I file a bug report with Apple so that something so basic and rudimentary gets fixed in their browser?
