メディアクエリで「em」を使うと基準になるのは何のサイズ？

メディアクエリを書くときの単位って、何を使ってますか？ 僕はいまのところpxしか使ってないんですが、先日、「PX, EM or REM Media Queries? 」という記事を読んで、メディアクエリで使うemやrem単位について、逆に混乱してしまったので、自分でも仕様やブラウザの挙動を確かめてみました。 結論から言うと、emもremもSafariで挙動の違いがあるので、pxがクロスブラウザで一番安定した挙動をします。 いったいどういうことになっているのか？ 僕自身、めちゃくちゃ混乱してしまったので整理してまとめておきます。皆さんをさらなる混乱に陥れないことを願いつつ。。。 メディアクエリでemを使う際のブラウザの挙動 メディアクエリでem単位を使うと、そのサイズはブラウザのフォントサイズ設定に相対的になると仕様に書いてあります。なので、ブラウザでフォントサイズの初期値が16pxの場合、

[field_combat]

結論としてはpx使えらしい。

[lazex]

emとpxで変わるタイミングずれてると思ったらデフォルトフォントサイズが15pxになってた。フォントサイズの設定なんていじった覚えないのになんでだろ。15pxの時代があってずっと使い続けてるとそのままとかあるのかな？

[kai82goro]

難しすぎてついていけないかも。