2019年5月4日土曜日

Chromeで文字が大きくなる のを対策したらメニューのPosition:fixedが動かない

スクショ
エクステンション
を紹介↓

なぜか、ふっと見るとChromeだけ文字がやたら大きく見えて、これは何とかならんかとググり、 と賢いようなフリをして書いた… これは使ってはいけない!

すると…ふっと、気がつくと、メニューのpositon:fixedが動いてなかった…
なんか、親要素に、transformが指定されていると、挙動しなくなるそうです。



いや、心臓止まったよ。 

Chromeが文字が大きく見えるのは、font-size: calc(112.5% + 0.35vw); などと指定してみましたが、この記事にあるように、emで指定してもいいですね。

transformって、rorate()の回転する要素としか知らなかったのですが、
こんなCSSがあったのかと…
webkitTransform:scale() は違うような気がするけど、
いくら、コピペでも意味くらいわかってないとダメだと反省した。

美しいメニューの固定方法5例 

ページ全体のスクショが取れるChromeのエクステンション FireShot
一番上の画像をとれる。無料です!



こういうのを
じっくり
読みたいです。
暇がないので、いつまでたっても体で覚えているのだった。
情報をくださる皆様。本当にありがとうございます。

0 件のコメント:

コメントを投稿

コメントありがとうございます。