column-count: 3 等を使ったCSSでの段組をして、印刷物をデザインする際にハマったことを共有します(ある程度段組CSSと印刷用CSSを知っている方を対象に書いています)。 バックグラウンド 行程さん 「行程さん」という、旅のしおりをウェブ上で簡単に作るサービスを作っています。今回はそのしおりをアナログ回帰させて、簡単に印刷してもらうために印刷専用のプレビュー画面をウェブ上で作ろうとしたのが始まりです。 機能 二つ折り用と三つ折り用 印刷されるものと同じ 考慮すること 特定の誰か、というものをあまり考えず、なるべくすべての環境で印刷可能にしたいと考えました。 日本、日本人 年齢 10代〜60代くらい ネットリテラシー ある ない 通信速度 遅い 速い OS、端末 Windows macOS Android iOS 印刷するプリンター 所持 コンビニ 対応ブラウザの決定打になった
![CSS段組と印刷の地雷](https://cdn-ak-scissors.b.st-hatena.com/image/square/81bef4381e447daea48ea3ea45b21d658c91c27c/height=288;version=1;width=512/https%3A%2F%2Fyoshikawaweb.com%2Fw%2Fwp-content%2Fuploads%2Fcss-column-print.jpg)