CSS Page-Break не работает во всех браузерах

У меня проблемы с тем, чтобы это работало в большинстве браузеров, за исключением IE (он работает корректно даже в IE6) и Opera.

Firefox правильно разделяет div, но печатает только первую страницу.

Chrome и Safari применяют разрыв страницы только к последнему div.

Как мне заставить это работать правильно во всех браузерах?

HTML:

<div id="leftNav">
  <ul>
    <!--links etc-->
  </ul>
</div>
<div id="mainBody">
 <div id="container">
  <div class="pageBreak">
   <!--content-->
  </div>
  <div class="pageBreak">
   <!--content-->
  </div>
  <div class="pageBreak">
   <!--content-->
  </div>
 </div>
</div>

Div с идентификаторами #leftNav и #mainBody имеют значение float: left , поэтому они хорошо отображаются.

Я хочу только распечатать классы .pageBreak , скрывая #leftNav и остальная часть #mainBody с CSS.

CSS:

@media print
{
 #leftNav
 {
  display:none;
 }
 #mainBody
 {
  border:none;
  margin:none;
  padding:none;
 }
}
49
задан Richard Parnaby-King 26 June 2017 в 05:02
поделиться