[CSS3]レスポンシブで メディアクエリ使う際の注意点 印刷でレイアウトが崩れる対処
クライアントさんから指摘あるまで気にしてなかったのですが、
レスポンシブでメディアクエリで画面幅に沿ってCSS切り替えする際に
@media screen and ～
の記述だと 文字通り 「画面のみ」の表示となってしまうので
<style type="" media="all">
で対応させていても、スルーされます。なんてこったい。
対処方法は
@media print, screen and ～
と書くだけですが、スマホ向けのCSSでも書いてしまうと、
印刷プレビュー時にスマホのレイアウトが出てきてしまうので
基本はPCのみでOKだと思います。
印刷プレビュー マジであせりました…