【Chrome】横向き印刷ができない・レイアウト設定が印刷プレビューに表示されない原因と対策メモ

とあるページをChromeの「印刷」から「PDFに保存」しようとしていました。

しかし、印刷プレビュー上で横幅が足りない表示になってしまったため、用紙を横向きにしたらどうかと試してみることにしました。

具体的には、印刷プレビューの右に表示される設定から用紙を「縦」から「横向き」に変更しようとしたのですが、用紙の向きを変更することができませんでした。

具体的には、横向きに設定するための設定項目である「レイアウト」が、印刷プレビューに表示されませんでした。

これでは、横向き印刷ができません。

また、普段「詳細設定」の中に折りたたまれている設定項目である「１枚あたりのページ数」や「余白」「オプション（ヘッダーとフッター、背景のグラフィック）」などが直接設定項目に表示されており、他にも、「A4」などを指定できる「用紙サイズ」や、「倍率」を指定することもできないことが分かりました。

通常であれば、次のような設定が表示されます。

そこで他のページで印刷プレビューを開いてみたところ、他のウェブサイトであれば、横向きにすることができました。

つまり、特定のサイトでだけ、横向きにできない状態です。

プリンターも、「PDFに保存」ではなく、物理的なプリンターに指定を変更してみましたが、設定項目がいろいろと変わるものの、やはり他のページを印刷するときには表示される「レイアウト」が表示されませんでした。

この現象は、現象が発生しているページ側に何らかの要因があるのであろう、と予想し、印刷に関するウェブサイト側の設定を確認してみました。

すると、印刷時にだけ有効になるデザインの設定（CSSの@media print内）で、@pageという、印刷のページ設定を強制する設定が行われていることが分かりました。

横幅（width）や縦幅（height）、用紙サイズ（size）などが直接指定されていました。

そして、その指定さえなければ、そのサイトであっても横向きに印刷できることが分かりました。

直接的な対策としては、その指定を外して印刷する、という方法が考えられます。

ChromeのDeveloper Tools上でCSSを編集するなどの方法です。

しかし今回は、印刷したい範囲をドラッグ＆ドロップで選択した上で、右クリックをして「印刷」を行いました。

というのも、いろいろ試行錯誤した中で、範囲を選択して印刷しようとすると、挙動が大きく異なることに気が付いたためです。

範囲を選択してから印刷をすると、印刷時の設定側の動作が異なる（指定が外れる／選択が優先される）ためか、横向き指定ができるようになりました。

印刷用のCSSが外れすぎてしまい、かえってうまく印刷できないケースもありそうですが、印刷したい場所が限定できる今回の場合には、ただ横向きにするだけよりも、うまく印刷することができました。

そのため、印刷の目的や、ウェブサイトにもよる可能性がありますが、手軽に試せる方法として、範囲を選択してからの右クリック→印刷も試してみてください。

なお、範囲を選択した場合、オプション設定内に「選択したコンテンツのみ」という設定項目が、チェックが入った状態で追加されます。

これを外して選択範囲を解除してもレイアウト設定が残ってくれると良かったのですが、そういうことはなく、この設定のチェックを外してしまうと、元のレイアウト設定がない状態に戻ってしまうようです。

• @page - CSS: カスケーディングスタイルシート | MDN