Печать PDF с фантомным js - правило @page не работает

Мы используем фантомную JS для распечатки PDF с веб-страниц (сайт интрасети). Моя проблема не со всем стилем, а только с правилом @page. Ни один из стилей в правиле @page не применяется.

Вы хоть представляете, что это может быть?

@page {
    size: auto;
    padding: 0 !important;
    margin: 10mm !important;
    page-break-before: avoid;
    border: none !important;
    page-break-after: avoid;
    page-break-inside: avoid;
    overflow: hidden !important;
    box-sizing: border-box !important;

    @top-left-corner {
        content: ""; /* has to be specified! */
        background-color: rgba(42, 201, 80, 0.220);
        border-bottom: solid green;
    }
}

Ответы

Ответ 1

В качестве показанного изображения описывается поддержка браузера для @page.

Ответ 2

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

Когда вы импортируете таблицу стилей, убедитесь, что вы используете print типа носителя или all

<link href="main.css" media="all" rel="stylesheet"/>

Ответ 3

Я думаю, что при экспорте в PDF phantomJS автоматически добавляет класс печати @media, который может переопределить многие правила CSS, установленные для @page.