Page Margins for printing in CSS

Question

I searched a lot before asking here, but didn't find an answer for my question.

I want to insert top and bottom margin for my website page when printed, so I used the normal margin-top and margin-bottom for the printed div but it affected on the first sheet only! so I used this as explained in W3C CSS2.1 Specifiction:

@page {
    margin-top: 5cm;
    margin-bottom: 5cm;
}

but no effect in Firefox Print Preview or Print to PDF. so how can I insert top and bottom margin (for each printed sheet) via CSS? or is there any trick to do this in Firefox?

Answer 1

Both

 @page {
    margin-top: 5cm;
    margin-bottom: 5cm;
 }

and

@media print {
     body {margin-top: 50mm; margin-bottom: 50mm; 
           margin-left: 0mm; margin-right: 0mm}
}

work fine in Firefox 35

Answer 2

This should work even in firefox

 @media print {
     #main{margin:100px 0;}
 }

The "@media print" will make sure the style is only used when printing.