Chrome 混合方向@page属性在第一页的宽度处呈现-解网

问：

我正在开发一个报告呈现系统（使用 Gotenberg，但问题来自 Chromium）。我需要能够在同一个 PDF 报告中同时包含横向和纵向页面。使用 CSS 命名页面似乎是解决方案，但是当我将横向页面放在纵向页面之后时，内容的宽度仅限于纵向宽度（尽管页面确实以横向打印）。

下面是一些显示问题的示例 HTML：

<html>
    <head>
        <style>
            @page {
                margin: 0.125in;
            }
            @page wide {
                size: landscape;
            }
            div {
                width:100%;
                height:100%;
                border: 3px solid red;
                page-break-after: always;
            }
            .landscape {
                page: wide;
            }
        </style>
    </head>
    <body>
        <div class="portrait"></div>
        <div class="landscape"></div>
    </body>
</html>

当我打印此页面时，您可以看到纸张是横向的，但内容仍然限制为纵向宽度。Chrome 打印对话框

FWIW，我在 M116.0.5845.96 Mac 的 Chrome 版本 64（官方版本）（arm1），但正如我上面所说，它也在 Chromium 中复制。

我真的希望我错过了一些东西，或者有一个解决方法。

CSS Google-chrome 铬哥腾堡

Chrome 混合方向@page属性在第一页的宽度处呈现

Chrome mixed orientation @page property renders at width of first page

评论