読者です 読者をやめる 読者になる 読者になる

Cordovaアプリでline-heightの値がおかしかった

環境はGalaxy S6 edge.

ionic-frameworkを使ってアプリを作成中のこと.
line-heightの値が56pxに指定されているのに,実際は44.8pxになっていた.
f:id:oboenikui:20161103022945p:plain

他の値に設定した感じ,常に0.8倍されていた.

おかげでアイコンがズレる.
f:id:oboenikui:20161103023218p:plain

原因

システム設定のフォントサイズを最小にしていたのが原因.(極小も同じになった)
メーカーカスタマイズされていないAndroid 6.0では小・中・大・極大しか選べないようなので,サムスンのカスタマイズが悪さをしていた.
恐らくフォントサイズを「小」よりも小さくするとスパースになるためにそのような仕様にしていたようだ.(本来の意味でのline-heightを指定するときは倍率で指定すべきらしいので,デフォルト値のみを変えるようにして欲しいものだが)

しかし,CSSのline-heightで中央指定することによって図形や文字を中央に配置するのは,本来のline-heightの目的と違うのではないかとも思う.(楽なので結構やってしまうが)
この場合悪いのはカスタマイズなのだろうか,それともそのような指定なのだろうか…