Developers Summit 2017 の参加証を印刷すると途中で切れるんですけど!

もうすぐデブサミですね

先日、参加証DLのお知らせが届きまして、意気揚々と印刷したところ参加証が途中で切れる事態が発生!

FireFoxのせいかと思いきや、Chromeでもだめ(たぶんIEも)。
周りの方々の意見を参考にしてみると、どうやら申し込みセッションが多いと、タイムテーブルのエリア(右上)が下に伸びてしまい、印刷範囲に入りきらないようでした。
(僕は一応すべての時間帯のセッションを予約していました)

問題はないといえばないのですが、中心から点線がずれてしまうので、4つ折りにしたときなんかに少し気になります。

まぁデベロッパーの祭典とのことなので、参加前からすでにデベロッパー度を試されているのかも知れません。
ということで何とかしましょう。

FireFox でなんとかする

F12 で開発ツールを開いたら、スタイルエディタタブを選択します。

左上にある + をクリックして、新規にスタイルシートを作成したら、↓のコードを書いてください。
(直接 <インラインスタイルシート#1> ってやつを編集しても問題ないと思います)

print.css

@media print {
  ul.menu li {
    font-size: 10px;
    margin-bottom: 6px;
  }
  ul.menu li br {
    display: none;
  }
}

あとはプリントするだけです。
印刷プレビューが見たい方は、ファイル > 印刷プレビュー からどうぞ。
セッションの内容によっては、これではきれいに表示されないケースもあるようです。
あとの微調整は皆さんのデベロッパー力でなんとか。

ほかのブラウザでも

同じようにしたらできるのではないでしょうか。(たぶん)