Форматирование CSS A4 печать

Question

Как я могу кодировать стиль CSS, чтобы принудительно использовать определенные поля страницы для печати при печати и быть действительными для IE и Firefox?

Answer 1

Используйте тип печати «печать» (печать @media).

Не устанавливайте фиксированную ширину и максимальную ширину. Сделайте вместо этого содержимое. Если вы укажете любое значение с (px, em, pt, cm), вы всегда будете сталкиваться с одной или другой проблемой, потому что разные браузеры добавляют разные поля.

A4, letter, A3, это не ваша забота. Вашему документу все равно. Пользователь может распечатать документ на любой бумаге, которую он имеет, потому что ваш контент является текучим.

Find some tips about css for print here.

Answer 2

Один из способов заключается в использовании SVG вместо. С SVG, вы можете использовать что-то вроде этого:

<svg width="19cm" height="26.5cm" viewBox="0 0 1900 2650" xmlns="http://www.w3.org/2000/svg" version="1.2"> 

Тогда вы просто убедиться, что все ваши элементы находятся в пределах вашей точки зрения 1900x2650.

К сожалению, это связано с «воссозданием» вашей страницы в SVG, что является довольно неудобством. Однако, похоже, это необходимо. HTML & Решения CSS не могут гарантировать, что содержимое не будет перетекать на несколько страниц, на которых вы предназначались, чтобы это была одна страница.