Как стилизовать строку до того, как страница разрывается по сравнению с концом таблицы? ⇐ Html

[Anonymous]

Младший разработчик здесь. Я пытаюсь динамически генерировать (через руль) отчет PDF с драматургом. Кажется, я не могу получить таблицу красиво расщепляться на страницы. После последней строки таблицы на первой странице я хочу, чтобы таблица закончилась прямыми углами (как на втором изображении) вместо специфичных для таблицы, округлых углов (как видно на первом изображении). Как я могу закончить первую строку более хорошо на первой странице (как видно на втором скриншоте)? Как я могу обнаружить, что конец страницы был достигнут, так что я заканчиваю таблицу не окружающими углами (чтобы указать, что таблица продолжается на второй странице)? /> желаемое решение < /h2>
Я бы хотел, чтобы фон таблицы обернул строку на первой странице, как видно на изображении ниже. Я хочу прямые углы. Но я все еще хочу сохранить округлые углы в самом конце таблицы. Более того, если я попытаюсь визуализировать страницу в браузере, она пустая, потому что все обернуто рулем.

Код: Выделить всё

table {
padding: 12px 4px 4px;          /* top | right/left | bottom */
background: #faf9f8;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 12px;
border-radius: 12px;
outline: 1px #e9e4e2 solid;
outline-offset: -1px;
font-size: 12px;
}

tr {
padding: 0 16px;                /* top/bottom | left/right */
gap: 16px;
display: flex;
justify-content: flex-start;
align-items: flex-start;
}

tbody {
align-self: stretch;
padding: 12px;
background:white;
border-radius: 10px;
outline: 1px #e9e4e2 solid;
outline-offset: -0.5px;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
display: flex;
}

tbody tr { /* Different from just tr, as that affects tfoot elements too */
align-self: stretch;
padding: 12px 4px; /* top/bottom | left/right */
}

table tbody tr:not(:last-child) {
border-bottom: 1px #e9e4e2 solid;
}

table tbody tr:last-child{
padding-bottom: 0;
}

table tbody tr:first-child {
padding-top: 0;
}
< /code>
 le < /h1>
Если вы заметите на первом изображении, границы таблиц и tbody странно, резко обрушиваются. Это было потому, что границы были определены с учетом 

вместо границы . По-видимому, на уровне Playwright's Page.pdf () -API это имеет значение. В Интернете они выглядят идентично.

Подробнее здесь: https://stackoverflow.com/questions/796 ... -table-end