How to make "page-break-inside:avoid" work for HTML import

Hello,

I’m positively surprised about how good HTML import is working for Aspose.Words. However, I’m having a problem with “page-break-inside:avoid” for HTML import.

In our HTML, we have the “page-break-inside:avoid” style on div elements. However, because div elements are converted to Sections, there is no support for page break behavior. We are not sure how to make “page-break-inside:avoid” work instead.

The style “page-break-before: always” is working perfectly for heading (h1,h2,etc.) elements. However it does not make sense to apply the “page-break-inside:avoid” on headings, because headings are not containers for text elements or tables.

We also tried the “page-break-before: always” on paragraph elements (p tags), but this also does not produce the expected result.

To view the HTML we tested with, please visit: Edit fiddle - JSFiddle - Code Playground. We imported it by using “builder.InsertHtml(html);” and then exported it to a docx document.

Our expectation was that the second paragraph would appear on the next page on its own. However, this is not the case. Can you explain what we are doing wrong?

@adc38c4

Thanks for your inquiry. We have converted your sample HTML to DOCX with Aspose.Words and MS Word, both are showing same results. As Aspose.Words mimics MS Word, so it is expected behavior.

Furthermore, to accomplish your requirement you may add “page-break-before: always” in br tag. Please find attached sample HTML and output DOCX for reference. Hopefully it will help you to accomplish the task.always_pagebreak.zip (7.0 KB)

<br style="page-break-before: always">

Thank you for your response.

I see now, that MS Word indeed does not have a feature to ‘group’ a heading and a paragraph. However, I have found a solution in the following way:"

<h1 style="page-break-after:avoid">Heading 2: avoid page break</h1>
<p style="page-break-inside:avoid;">
    Avoid page breaks
</p>

This produces the expected result.

@adc38c4

Thanks for your feedback. It is good to know that you have managed to resolve the issue.

Please keep using our API and feel free to contact us for any further assistance.