HTML to PDF Conversion Issues: Table Row Borders, Page Breaks, and Text Transform

Aspose.PDF Product Family
, ,
1

  1. Table Row Borders on Page Break
    When a table row splits across pages, the border on the previous page doesn’t close properly. We tried:

    table { box-decoration-break: clone; }

    This CSS property is ignored. Request: Alternative solution to ensure row borders render correctly when split.

  2. Page Break Inside <tr>
    Adding page-break-before: always; to a <tr> does not force a page break:

    <tr style="page-break-before: always;">

    *Request**  : How to enforce page breaks for table rows?

  3. ** text-transform: capitalize; Failure **
    CSS text-transform: capitalize; outputs text in ALL CAPS instead of capitalizing words.

  4. Request* : Fix or workaround to apply text capitalization.

PFA
image.png (62.3 KB)

2

@karan007

To address the issues you’re facing with HTML to PDF conversion, here are some solutions for each of your concerns:

  1. Table Row Borders on Page Break: The CSS property box-decoration-break: clone; is not supported in PDF conversion. To resolve this, manually adjust the borders of the table rows in your HTML. Use a combination of CSS styles to ensure that the borders are visually consistent across page breaks. For example, apply a solid border style and ensure that the last row of a table has a border that visually connects to the first row of the next page.

  2. Page Break Inside <tr>: The page-break-before: always; style does not work as expected for table rows. Instead, wrap the content of the <tr> in a <div> and apply the page break style to that <div>. This approach can help enforce the page break more effectively.

  3. Enforcing Page Breaks for Table Rows: To enforce page breaks for table rows, use the display: block; style on the <tr> elements or wrap them in a <div> with the page-break-before: always; style. This will ensure that the rows are treated as separate blocks, allowing for proper page breaks.

  4. Text Transform Issue: If the text-transform: capitalize; CSS property results in all caps instead of capitalizing the first letter of each word, it may be due to the PDF rendering engine not fully supporting this property. As a solution, manually capitalize the text in your HTML before conversion or use JavaScript to transform the text prior to sending it to the PDF generator.

Please implement these solutions and let me know if they resolve your issues or if you require further assistance!

3

Other than the Table Row Borders on Page Break issue, we were able to resolve all other problems. We tried different solutions for this specific issue but were unable to fix it. This is mainly because the table HTML data is dynamic, so we cannot modify or apply inline CSS directly. We can only use internal CSS applied at the tag level — which worked to some extent, but didn’t fully solve the problem.

please suggest us workaround for same !!

4

@karan007

Would you please share your sample HTML and output PDF along with the sample code snippet? We will test the scenario in our environment and address it accordingly.