「A4横」左図の帳票レイアウトを作成して印刷しようとしたら、横幅が狭く表示されてうまく行きませんでした。
WEBサイトを検索すると、あちこちにこうすればできると書いてある。
ちなみに、bootstrap5 を使ってレイアウトしてます(帳票なのでレスポンシブは考慮してない)
@page {
size: A4 landscape;
size: 297mm 210mm;
margin: 0mm;
}
A4横に、なるにはなるんだけど、コンテンツの横幅がどう見ても狭い。
A4縦の時の横幅を超えない(程度の)横幅でしか印刷されない・・・・
なぜじゃ!?
いろいろ調べたり、調べてもらったりして bootstrap がまずいことがわかりました。
(Hさん、ご協力、ありがと。)
bootstrap の次の部分が影響してましたよ、と。
.container, .container-lg, .container-md, .container-sm{
max-width: 960px;
}
以下のようにスタイルシートを追記すると、ちゃんとA4横で印刷されるようになりました。
@media print {
.container {
max-width: 297mm !important;
}
}
めでたし、めでたし。
0 件のコメント:
コメントを投稿