font-size には rem を使うべきかどうかについての見解

font-size-rem.md font-size には rem を使うべきかどうかについての見解 結論 可能であれば Chrome の文字拡大機能をサポートするためにremを使用する。 ただし、実際に Chrome の文字拡大機能を「極大」にして検証することが必須条件。これに時間的・労働的なコストを割けないのならpxを使用したほうがいい。 結論に至った背景 「font-size には rem を使いましょう」という教えが独り歩きしており、実際に Chrome の文字拡大機能を「極大」にして検証していない人が多いため。 font-size だけ rem を指定すればいいという訳ではなく、文字拡大に伴ったレイアウトの変更に耐えうる設計とする必要がある。つまり、font-size だけでなく文字の拡大に依存する余白やサイズなどもフォントサイズを基準とした相対値（remやemなど）で指定する必

[umai_bow]

rem と px を交えて複雑になる/崩れるぐらいなら、　すべて px 指定で単純なスケーリングをしてもらったほうがマシではと思う

[shiromatakumi]

基本remだけど、幅が狭い要素や絶対配置とかレイアウト崩れそうなとこはpxにしてる

[toblog]

ところで行政とかのあのよくある文字拡大ボタンって役に立ってるの？

[prostaglandin]

初めてremで実装して納品した後に「拡大したらなんか崩れるんですけど」って言われて光の速さでpxに直したことあったなあ。実機検証は大事。

[yellowsoil]

開発ファイルと公開ファイルを分けて運用するなら、postcssのプラグインでpxをremに変換するのが一番手間が少ないよ。

[hdampty7]

昔、全部をremにして失敗したことがあった。文字の拡大比率と余白の比率は違うという基本的なことを学んだ。結局ブレイクポイントごとに余白の値は変えないと見れたもんじゃない。

[pmint]

脱字訂正で崩れるコード書いてそう。要件によってremかvwだろう。pxは環境やviewportによるので使えない。pxだと崩れない…？スマホの全モデルでズレやはみ出しの検証いるでしょ。pxがデバイスピクセルに相当するわけない

[diveintounlimit]

自分はshiromatakumiさんと同じ。本件とは関係ないけど「HTMLはそもそもデザインのためのものじゃないからブラウザごとにずれるのは当たり前で、細かい調整など無意味」という過激派と話が合わなかったのを思い出した。

[Nobkz]

いやめちゃくちゃ、拡大機能の検証をしないなら、px を使おうが、remを使おうが関係ねぇだろ。

[emj1025]

ワイも最近は文字サイズ極大にしてコーティングチェックしてる

[inazuma2073]

IE6が滅びたことでブラウザのズームに関しては決着がついた。そう思っていた時期が俺にもありました。

[sigwyg]

開発フローで文字拡大検証やらないならpxが良い。気合い入れてremシステムを組んでも、運用で壊れたら意味ない

[nmcli]

rem は検証にリソース割けるときだけだな

[tohokuaiki]

よくわからないが何か考えないといけないのか。

[ttkazuma]

文字サイズで崩れないようなレイアウトにするとデザインが単調になるジレンマ

[shinoppie]

だよな。pxでいいと思うよ。 利点がよくわかんない。

[suekunhello]

コンポーネント内で文字サイズが狂いにくいという点が大きいのかな。OSの持つ文字拡大などに同期できるといいね。フォントウェイトも。

[jintrick]

可能であればfont-sizeの単位の変更くらいでレイアウトが「崩れ」ないようなスタイルシートをまず検討したい。そのあとはケースバイケース。

[himanahitodesukun]

開発者には「崩れのない状態を実現すべき」との固定観念があると思う。実際にはそれは理想論であるしユーザーは崩れを気にしないこともある。スマホから無理やりPCレイアウトを見たい時もある。可能性を閉じないで

[webooker]

rem推奨だけどchromeで文字の拡大をしてチェックすべきと。

[nowrika]

vw派です

[ni_ls]

（コピペで要素使い回す時に相対値のほうが崩れが出にくいので……）

[snarkysaturn]

better to use rem, if you use it on all properties (everything) then responsiveness wont break , try it , here is 2 examples - https://www.washingtoninsider.org/business/Julio-Herrera-Velutini-and-His-Business-Investments-in-the-Global-Market/ and its homepage https://www.washingtoninsider.org/

[kijtra]

clamp とか max とか使ったらどうか

[dorapon2000]

“上記の理由から実際に文字拡大機能を動かして検証を行い、かつ拡大時のレイアウト調整に時間的・労働的コストを掛けられる現場のみがremを使用するのが良い。”

[mayumayu_nimolove]

まだこの議論って続いてるんだね