Page 1 of 1

DITA to PDF Using HTML5 and CSS: Table Row Breaks

Posted: Sun Oct 10, 2021 7:08 pm
by patjporter
Hello,

I have been studying your Oxygen PDF Chemistry user guide and researching on the internet, but I cannot figure out how to prevent rows from breaking across a page. Can you help me understand what to set in the CSS to prevent this (a row should start on the next page if it is going to break across a page):
Screen Shot 2021-10-10 at 11.58.27 AM.png

I added this to the CSS but that did not prevent the page break:

/*prevent-table-row-page-break*/
@media print {
row {
page-break-inside: avoid;
}
}

Also, how would I add more padding between a table and the top of the page?

Thanks!
Pat

Re: DITA to PDF Using HTML5 and CSS: Table Row Breaks

Posted: Mon Oct 11, 2021 2:01 pm
by Dan
There are some examples here:
https://www.oxygenxml.com/doc/versions/23.1/ug-pdf-css/
https://www.oxygenxml.com/doc/versions/ ... e_breaking

I will add an example specific to the rows.

First of all, the elements from DITA topics are transformed into HTML elements that preserve the default DITA class attributes. For example the <row> element in your topic has the default class attribute "- topic/row" and it is transformed into HTML as a <td class="- topic/row row"/>. Thus you cannot match it with a simple element selector using the original DITA name, like:

Code: Select all

row {
  page-break-inside: avoid;
}
Instead you have to use:

Code: Select all

*[class ~= "topic/row"] {
  page-break-inside: avoid;
}
Since we forbid all page breaks inside the row, the contents will be "glued" togehter. Please make sure the contents of your rows does not exceed the height of the page, otherwise the row bleeds out of the page.

Many regards,
Dan