I have an HTML table of data where each cell can have multiple lines of text. When the table is printed, it's possible for a row to be broken up so that some of the data appears at the bottom of the first page and some appears at the top of the next. Is there an equivalent to Word's "keep together" functionality that will prevent a page break from happening within a table row? I would think this would be a common problem, but the only "answer" I could find was hidden on a certain hyphenated web site. :)
Update: The data will be viewed using IE 7, which it appears does not handle the "page-break-inside" property correctly (if at all). Are there alternatives? Is this something jQuery can help with?
In order to prevent a table to be split in several pages it is required to apply the page-break-inside and page-break-after styles to all of its contents. This trick works unless the table occupies more space than a full page. It is also possible to use custom styles.
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. Save this answer.
Definition and Usage. The page-break-after property adds a page-break after a specified element. Tip: The properties: page-break-before, page-break-after and page-break-inside help to define how a document should behave when printed.
We can add a page break tag with style "page-break-after: always" at the point where we want to introduce the pagebreak in the html page.
try:
The CSS2-friendly way to do it would be
td { page-break-inside: avoid; }
see the page-break-inside definition
from: http://channel9.msdn.com/forums/TechOff/35322-Keep-with-next-when-printing-HTML-tables/
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