Firefox adds 5mm additional margin to @page directive
I am writing a CSS style sheet for printing a web page and encountered the
following problem: Firefox adds additional margin to a @page directive.
Here is an example.
HTML:
<html>
<head>
<title>CSS Print Test</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="content">
Print Me!
</div>
</body>
</html>
CSS:
html,
body,
div {
margin: 0;
padding: 0;
}
#content {
border: 1px solid;
}
@page
{
size: A4 portrait;
margin: 30mm 30mm 30mm 30mm;
padding: 0;
}
This should give the page a margin of 3 cm on each side. It works for
Chrome (29.0) and IE 10 but not for Firefox (21.0). When printing the page
with Firefox the margin on each side is something like 35mm.
Is there a simple solution or at least an explanation for this behavior?
No comments:
Post a Comment