Печать html-страницы - разрыв страницы

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

Однако я не хочу, чтобы поля разделялись между страницами при печати, как это происходит, когда поле начинается ближе к концу страницы и печатается часть текста, а остальное - на следующей странице. Я использовал javascript для вставки div разрыва страницы (имеет стиль page-break-before:always), когда общая высота div на странице превышает 800 (assumed value).

Однако, когда я печатаю, размер текста меняется, блоки div становятся длиннее / короче, а разрывы страниц неуместны.

Я делаю то же самое, что сказано в ответе здесь. Мой вопрос в том, что я предполагаю шириной / высотой напечатанной страницы? Или есть решение получше?

Как мне с этим справиться? Заранее спасибо.

РЕДАКТИРОВАТЬ: я использую CSS для печати, к сожалению. Также у меня есть определенные стили мультимедиа и стили печати.

РЕДАКТИРОВАТЬ (попытаться визуализировать)

-------div 1------ 
 |                 |
 |                 |
 |                 |
  -----div 2-----
 |                 |         WRONG
 |                 |
 |                 |
  ----div 3-------
 |                 |
 |                 |
 |  auto page break|
 ----page 1 ends---- 
 |                 |
 |                 |
 |                 |
 ----div 4----------


 -------div 1------ 
 |                 |
 |                 |
 |                 |
  -----div 2-----
 |                 |         RIGHT
 |                 |
 |   script 
    generated 
     page break    |
  ----div 3-------
 |                 |
 |                 |
 |                 |
 ----page 1 ends---- 
 |                 |
 |                 |
 |                 |
 ----div 4----------

person cowboybebop    schedule 22.08.2011    source источник
comment
Давайте проясним это, вы хотите, чтобы разрыв страницы происходил между ‹div›, но не внутри них? Но вам же не нужен разрыв страницы, если есть достаточно места для другого ‹div›?   -  person Ibrahim AshShohail    schedule 23.08.2011
comment
Убедитесь, что предполагаемая высота на печатной странице правильная. Неужели 800? Более? Меньше?   -  person Ibrahim AshShohail    schedule 23.08.2011
comment
@ibrahim, проблема не в предполагаемой высоте. У меня одинаковый размер шрифта 12 pt как в СМИ, так и в печати. Но на экране это проявляется по-другому, а на бумаге - по-другому. В результате то, что на экране составляет 800 пикселей, на бумаге кажется больше.   -  person cowboybebop    schedule 23.08.2011
comment
@ibrahim, это то, что я делаю прямо сейчас .. Но высота между экраном и печатью искажается.   -  person cowboybebop    schedule 23.08.2011


Ответы (2)


Убедитесь, что вы используете CSS, определенный для печати:

<link rel="stylesheet" type="text/css" media="print" href="print.css" />

Если в вашем CSS для атрибута media установлено значение screen или другое значение, кроме print или all, принтер не увидит ваш CSS.

person AlienWebguy    schedule 22.08.2011
comment
Я. Вот почему проявляется разница. Я вычисляю разрывы страниц с помощью javascript, а печать css искажает высоту. - person cowboybebop; 23.08.2011

Неважно. Я принял ширину 600 и высоту 800. Я не нашел лучшей комбинации, но это тоже работает.

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

person cowboybebop    schedule 22.08.2011