Skip to content

Incorrect border rendering when paginated tables span multiple pages #155

@dogbokchif

Description

@dogbokchif

Incorrect border rendering in the middle of a page when using -fs-table-paginate: paginate;

The conditions are as follows:

  • A table with -fs-table-paginate: paginate; applied
  • A specific cell has rowspan applied
  • Other cells in the same row (excluding the rowspan cell) are not split onto the next page
  • The following row (including the rowspan cell) spans across three or more pages
  • The content of the rowspan cell is rendered around the middle of the second page

example img
Image

example html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <meta http-equiv='Content-Type'/>
    <meta content='text/html; charset=utf-8'/>
    <meta charset='utf-8'/>
    <style type="text/css">
        td {
            border: black 1px solid;
            font-size: 28px;
            text-align: center;
            padding: 10px;
        }
        thead td {
            background-color: #D4E9FF;
        }
    </style>
</head>
<body>
<div style="height: 300px"></div>
<table style="-fs-table-paginate: paginate; width: 100%; border-collapse: collapse;">
    <colgroup>
        <col width="10%"/>
        <col width="15%"/>
        <col width="15%"/>
        <col width="15%"/>
        <col width="15%"/>
        <col width="15%"/>
        <col width="15%"/>
    </colgroup>
    <thead>
        <tr>
            <td>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>1</td>
            <td>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>2</td>
            <td>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>3</td>
            <td>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>4</td>
            <td>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>5</td>
            <td>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>6</td>
            <td>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>5</td>
            <td>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>H<br/>e<br/>a<br/>d<br/> <br/>6</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td rowspan="2">B</td>
            <td>Body 2</td>
            <td>Body 3</td>
            <td>Body 4</td>
            <td>Body 5</td>
            <td>Body 6</td>
            <td>Body 7</td>
            <td>Body 8</td>
        </tr>
        <tr>
            <td>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y <br/>8</td>
            <td>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>9</td>
            <td>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>10</td>
            <td>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>11</td>
            <td>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>12</td>
            <td>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>13</td>
            <td>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>B<br/>o<br/>d<br/>y<br/> <br/>14</td>
        </tr>
    </tbody>
</table>
</body>
</html>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions