Предотвращение разрывов страниц в таблице при печати

У меня есть страница, которую я пытаюсь настроить для печати. Эта страница содержит большое количество отдельных таблиц. Таблицы различного размера, но, в общем, я могу разместить от 2,5 до 3 таблиц на каждой странице. Я хотел бы иметь возможность предотвратить разбиение таблиц на разрыве страницы. Любая идея, как я могу это сделать?

Я пробовал это:

.reportTable {
    page-break-inside: avoid;
}

К сожалению, page-break-inside поддерживается только в Opera (согласно W3Schools - я проверил, что это не работает в Firefox 4.0.1).

Я могу сделать это, чтобы заставить разрыв страницы перед каждой отдельной таблицей:

.reportTable {
    page-break-after: always;
}

Это работает, чтобы вставлять разрывы страниц и, кажется, поддерживается во всех основных браузерах, но это оставляет меня с пустым пространством на печатных документах (примерно половина каждой страницы пуста). Я действительно хочу только разрыв страницы, если вся следующая таблица не будет помещаться на этой странице.

Я знаю, что у меня есть пользователи, использующие Internet Explorer, Firefox и Safari, поэтому я действительно хотел бы поддержать их как можно больше. Поиск чего-то, что также будет работать в Chrome и Opera, будет очень приятным бонусом.

Любые идеи?

Ответ 1

Я также искал ответ на этот вопрос. Самое близкое, что я пришел, - это знать, сколько строк вывода будет помещаться на странице, а затем вычислить, сколько строк вывода было на странице. В твоем случае: 1) выяснить, сколько строк вывода вы можете поместить на страницу. 2) отслеживать, сколько строк вы уже использовали, отображая первую таблицу. 3) подсчитайте, сколько строк займет таблица 2. Добавьте его в таблицу 1 строки и посмотрите, все ли вы ниже приблизительного порога. Если вы находитесь, отобразите таблицу, если нет, поместите div вниз с разрывом страницы: всегда в нем, чтобы заставить новую таблицу.

Это даст вам примерно то, что вы ищете, но оно не будет идеальным. раз и навсегда, у вас будет таблица, которая "могла бы" соответствовать предыдущей странице, но просто не совсем сделала обрезание, потому что вы должны быть на низкой стороне оценки того, сколько строк накладывается на страницу,

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

Надеюсь, что это искра для вас.

Ответ 2

В настоящее время не существует способа заставить браузеры, которые не поддерживают page-break-inside: avoid, сделать это.

Однако, поскольку вы можете помещать от 2,5 до 3 таблиц на каждую страницу и предпочитаете не печатать только одну таблицу с помощью page-break-after: always;, вы можете выбрать специальную div, которая заставляет разрыва страницы после каждой двух таблиц.

Итак, вы должны включить <div class="pageBreak"></div> и скрыть его для экрана, но отобразите его для печати. И вы дадите ему стиль page-break-after: always;. Таким образом, вы получите как минимум две таблицы на странице.

Еще одно предложение - позволить пользователю решить, хочет ли он/она распечатывать одну таблицу на странице или столько, сколько может поместиться (возможно, с разбивкой по страницам). Вы можете переключить checkbox, чтобы добавить стиль page-break-after: always; к таблицам.

Ответ 3

чтобы исправить это, просто сделайте #table {страница-обкатка после: авто;}

Ответ 4

Это очень старый вопрос, поэтому просто хотел обновить этот разрыв страницы: избежать; теперь поддерживается в большинстве основных браузеров. Хотя есть некоторые особенности, чтобы убедиться, что page-break-xxx работает (НИКАКОЙ родитель на любом уровне не может иметь положение: фиксированный, элемент и прямой родитель должны быть позицией: относительный и дисплей: блок и т.д.).

Ссылка: https://developer.mozilla.org/en-US/docs/Web/CSS/page-break-inside

https://developer.mozilla.org/en-US/docs/Web/CSS/break-inside

Ответ 5

Не все принтеры созданы одинаково.

У вас проблемы, потому что принтер не контролируется ни веб-браузером, ни кодом html. Он управляется драйвером принтера, который поставляется вместе с принтером. Эта функция (и ее настройки) принадлежит владельцу компьютера, отображающего страницу, а не вам.

Ваш код не может заранее знать, сколько строк принтер, прикрепленный к пользовательской системе, может разместить на странице, или как принтер выложит таблицу. Это будет отличаться, если пользователь с другим принтером откроет страницу. Как и в случае с различными разрешениями экрана, существуют различные разрешения пикселей для принтера.

Таким образом, все правила, применимые к различным экранам (и их недостатки), также применяются к различным принтерам. Вы не только не знаете, где принтер сломает страницу, вы даже не можете знать, насколько велика печатная страница, с точки зрения того, сколько контента подходит для страницы.

Чтобы получить всю таблицу (или несколько таблиц) на странице, пользователь должен выбрать части, которые он хочет распечатать, а затем использовать выбор печати в диалоговом окне принтера.