CSS, чтобы остановить разрыв страницы внутри строки таблицы

Question

Я пытаюсь избежать разрывов страниц внутри строк для моих таблиц HTML, которые могут проходить за одну страницу. Я использую Internet Explorer Print Preview, а также BCL EasyPDFSDK для преобразования в PDF, чтобы проверить это. Я применил следующий стиль CSS в различных комбинациях к <td> элементы, но для каждого я получал нежелательный результат:

td {
    page-break-inside: avoid !important;
    white-space: nowrap;
    overflow: hidden;
    margin: 4px 0 4px 0;
}

Я верю page-break-inside: avoid !important работает, но только на <td> уровень. Например, я увижу <tr> это имеет один <td> в конце первой страницы со всем неповрежденным текстом, но следующий <td> теги будут на следующей странице со всем их текстом без изменений.

Я не думал, что вы должны были применить форматирование к <tr> поэтому я не уверен, как это исправить.

Должен ли я применить CSS к <tr> или есть другой способ добиться этого?

Спасибо за помощь!

Answer 1

Оказалось, что мне нужно было свернуть границы элемента таблицы и уменьшить мой отступ до 1px, используя

table { border-collapse: collapse; }
td {
    page-break-inside: avoid !important;
    white-space: nowrap;
    overflow: hidden;
    padding: 1px;
    font-size: xx-small;
}

Я также установил размер шрифта на xx-small на случай, если это станет причиной проблемы. Эта проблема, казалось, в первую очередь была решена, когда я свернул границы, поэтому меня интересует, были ли в таблице проблемы с разбиением строк из-за этого.

Ура!

РЕДАКТИРОВАТЬ:

После решения этой проблемы я обнаружил, что разделение строк обрабатывается гораздо лучше в новых веб-браузерах. Я настоятельно рекомендую обновить IE по крайней мере до 11, если у вас возникла эта проблема.

Answer 2

Я только что добавил приведенный ниже css в свой @media print, и он сработал!!!

Ни одно из решений, примененных к td, th, tr, не сработало

table {
  page-break-inside: avoid !important;
}