スマホ縦横表示で文字サイズが変わる場合

レスポンシブ対応でサイトを作成していると、ぶち当たるだろう問題。

スマホの縦で表示させると思い通りの文字サイズなのに、横で表示させるとなぜか文字サイズ(もしかしたら一部のみかも)が大きくなって表示される。

 

スマホの横で文字数が増えすぎないようにする配慮なのか、逆に読みにくくて配慮になるのか、なんだかよくわからん機能である。

いや、私は、縦も横も同じ大きさの文字サイズで表示させたいのよ!!

 

というわけで、回避方法は、下記をCSSに記載すればOK。

———————

html { -webkit-text-size-adjust: 100%;}

———————
おまじないのようなものですね。

 

100%の代わりにnoneでも対応可能だそうだが、それをやると、拡大表示されなくなるというユーザビリティ的にNGなことになるらしいので、100%で。

 

やれやれ・・・


category - works
tags - Tag : , ,

ページトップへ

Copyright © Ten blog All Rights Reserved.