尽管使用CSS来阻止它，但仍会出现分页符

Question

在我尝试以PDF格式导出的文档中，有一个注释表。该表由几行组成，第一行显示作者，第二行显示注释。注释行由单个单元格组成，该单元格是预包装器以维护空白，并包含每行文本的

元素或空格的元素。

每当评论行延伸到页面底部时，页面会断开并将整行推送到下一页，尽管我的css如下：

table {
    page-break-inside: auto;

    tbody {
        page-break-inside: auto;

        .comment-author {
            page-break-after: avoid;
        }

        .comment-content {
            page-break-before: avoid;
            page-break-inside: auto;

            p {
                page-break-inside: auto;
            }

            br {
                page-break-inside: auto;
            }
        }
    }
}

有人能解释我的错误吗？

根据要求，HTML就像：

<table>
    <thead/>
    <tbody>
        <tr className="comment-author">
            <td>John Smith</td>
        </tr>
        <tr className="comment-content">
            <td>
                <p>This would be the first line of text</p>
                <br/>
                <p>This would be the second line of text</p>
                // Etc for full comment content until last line
                // Designed to never end with a <br>
            </td>
        </tr>
    </tbody>
</table>

Answer 1

刚刚结束删除表并改为使用div。这意味着额外的CSS包括display：table-cell用于一致的设计。