え？@mediaクエリってpx設定じゃないの？

社内の有能な方々が、社内のレベルの統一を図るためでもあると思うのですが、ペーペーの私のところにも色々と新しいコーディング技術などを共有してくださります。有難い限り。。

そんな記事の一つです。
参考記事

https://coliss.com/articles/build-websites/operation/css/media-query-code-snippets.html

CSSの@mediaは、スクリーンサイズだけじゃない！ 最近の実装で使用されるメディアクエリのまとめ -mediaquery.style

プチ情報：その有能な方は、coliss記事が多いです。

私の知っている「レスポンシブ」と言えば、
PCなのかスマホなのかというところで、ほぼ２択で@mediaクエリを設定していました。スマホでもこんなに種類別に分けて設定できるんですね。。驚き。

え？emがいいの？とすぐに飛びついてしまおうかと思いましたが、、、

一旦、「@mediaクエリ em」で調べました。
参考記事

https://coliss.com/articles/build-websites/operation/css/media-query-units.html

[CSS]Media Queriesで使う単位はpx, em, remのどれが適しているか検証 -px指定は注意が必要

よく読むとまた私からはもっと先をいったお話だったかも。
私の期待してたことはレスポンシブに対してのスムーズな大きさの変化でした。
ブレークポイントを細かく設定していくことで、おかしな表示されないようにしてましたが、骨が折れます。日々、もっとスムースに表示できるようにならないもんかと思っています。

こちらの記事のポイントはそこではなく、ブラウザ上でfont-sizeを動かした場合、ズームした場合、htmlでfont-sizeを動かした場合に、各ブラウザーごとのブレークポイントに影響があるかないかでしたね。
[ px / em / rem ]の中で、パーフェクトはいませんでしたが、トータルの検証の結果、「em」ということなんですね。

なるほど、手元しか見ておらず、そんな先のことまで見据えてやってませんでした。。

1ミリ、前進 ! ! 明日は快晴 ! see you  ! !