Menu
My content is already on the same page, that's not what the problem is. (Some other questions on SO tackle that). My issue is with borders specificaly. See how the table border splits row 43 in two.
I would like 43 to be on the next page completely. 42 should have a bottom border and 43 should have a top border. Here is what I want. (I created this in paint)
I tried page break inside: avoid but that doesn't work. Neither does the 4px trick works. I am in latest stable chrome. 51
268
Similarly, you can avoid page breaks inside tables, lists, and any other block-level element. A code block split into two spanning across two pages because of a page break inside it. This can be avoided using the page-break-inside property.
Select the table which breaks across two pages, and then click Layout (under Table Tools) > Properties. See screenshot: 2. In the popping out Table Properties dialog box, (1) enable the Row tab, (2) uncheck the Allow row to break across pages option, and (3) click the OK button.
Syntax: page-break-inside: auto; avoid: It avoids a page break inside the element.
page-break-before: auto instead of . page-break-before: always. The "auto" will break the page only if the contents are at the end if the page, this will prevent breaking the page and leaving a lot of blank space. Show activity on this post.
Could you please try this css code:
<html>
<head>
<style>
@media print
{
table { page-break-after:auto }
tr { page-break-inside:avoid; page-break-after:auto }
td { page-break-inside:avoid; page-break-after:auto }
thead { display:table-header-group }
tfoot { display:table-footer-group }
}
</style>
</head>
<body>
....
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
