CODEWITHSUNDEEP
javascriptjqueryhtmlcssprinting
gFontaniva
gFontaniva

Reputation: 903

JS window print margins breaked table

I have a table that i want to print using JS window.print();. But when this table have too many lines oter pages dosen't preserve seted margins

enter image description here

My CSS:

@page { size:  auto; margin: 0px; }
html  { background-color: #FFFFFF; margin: 0px; }
body  { margin: 10mm 10mm 10mm 10mm; }
tbody > td > span { font-size: 14px !important; }

How can I force this table breaks to preserve margins?

Click on any element to print: https://jsfiddle.net/kfubawpg/

Upvotes: 2

Views: 7866

Answers (2)

Legends
Legends

Reputation: 22662

You can do the following:

    @page :first { // set the margins for the first page in print mode
      margin: 100px;
    }

    @page { // set the margins for all following pages (tables) in print mode
    size:  auto; 
    margin-top: 10px;
    margin-bottom: 10px;
    }

Here is a demo

Upvotes: 0

sn3ll
sn3ll

Reputation: 1685

You have the @page margin set to 0. Just change it to the size of the margin you want.

@page { size:  auto; margin: 50px; }

fiddle

Upvotes: 4

Related Questions