Question

I am trying to override the default page setup margins for my users. The document that I need them to print needs to have the margins gone. After TONS of looking, I found the following, and IT WORKS IN GOOGLE CHROME:

@page{
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
}

When I print this to PDF in Chrome, it prints a document with virtually no margins around the side. However, when I do the exact same thing in FF4 and IE9, it prints a document with large default margins.

Any ideas on how to make this work for IE9 and FF too? Supposedly the @page CSS stuff was part of the CSS2.1 spec, which all browsers IE8 and later support. So, I am not sure why it isn’t working for these pieces, and why Chrome is the only browser that has it.

Answer 1

dont use the px

The page context has no notion of fonts, so ’em’ and ‘ex’ units are not allowed. Percentage values on the margin properties are relative to the dimensions of the page box; for left and right margins, they refer to the width of the page box while for top and bottom margins, they refer to the height of the page box. All other units associated with the respective CSS 2.1 properties are allowed.

Specs