@media print div: Как устранить перекрытие текста страницы в заголовке?

Я использую @media для печати заголовка на каждой странице при печати экрана на странице в Firefox . Мой css настроен следующим образом:

@media print {
    div.printDivHeader {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.0em;
    position: fixed;
    display: block;
    width: 100%;
    height: auto;
    top: 0;
    }
}

Проблема в том, что содержимое второй страницы перекрывается с th e распечатать заголовок div. (т.е. на второй странице заголовок не заставляет содержимое страницы опускаться вниз, поэтому текст пишется поверх текста). Есть ли способ справиться с этим?

9
задан MTR 2 November 2011 в 13:59
поделиться

1 ответ

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

<table>
   <thead>
      <tr>
         <th>
             <!-- Elements you want to appear in the header -->
         </th>
      </tr>
   </thead>
   <tbody>
       <tr>
          <td>
             <!-- Content that may span multiple pages... -->
          </td>
       </tr>
   </tbody>
</table>
0
ответ дан 4 December 2019 в 21:41
поделиться