vue-print-nb
vue-print-nb copied to clipboard
Tables not breaking properly
Hello, I am enjoying your work, however I have long tables and these are not breaking correctly during print after each page and one row bleeds into the next. If possible there is a way to separate whilst printing. I am using chrome for development.
1 page setup
The @page rule is used to specify some attributes of the printed page, including characteristics such as paper size, orientation, margins, and paging. ·
@page :pseudo-class { size: A4 landscape; margin:2cm; }
2 pagination
page-break-before: used to set the paging behavior in front of the element, possible values:
auto: The default value. If necessary, insert a page break before the element.
always: Insert a page break before the element.
avoid: Avoid inserting a page break before the element.
left: Enough page breaks before the element, up to a blank left page.
right: Enough page breaks before the element, up to a blank right page.
inherit: Specifies that the setting of the page-break-before attribute should be inherited from the parent element.
page-break-after: paging behavior after setting the element. The value is the same as page-break-before.
page-break-inside: Set the paging behavior inside the element. The values are as follows:
auto: Default. If necessary, insert a page break inside the element.
avoid: Avoid inserting page breaks inside the element.
inherit: stipulates that it should be inherited from the parent element
page-break-inside: Setting of attributes.
@media print { section {page-break-before: always;} h1 {page-break-after: always;} p {page-break-inside: avoid;} }