Sometimes, we want to avoid page breaks inside the row of a table with CSS.
In this article, we’ll look at how to avoid page breaks inside the row of a table with CSS.
How to avoid page breaks inside the row of a table with CSS?
To avoid page breaks inside the row of a table with CSS, we set the page-break-inside property.
For instance, we write
<table class="print-friendly">
<!-- ...-->
</table>
<style>
table.print-friendly tr td,
table.print-friendly tr th {
page-break-inside: avoid;
}
</style>
to add a table.
Then we set the td and th styles to page-break-inside: avoid; to prevent page breaks within these elements.
Conclusion
To avoid page breaks inside the row of a table with CSS, we set the page-break-inside property.
