アイコンの縮尺問題は .sz16
や .sz32
といった分類名で CSS 変数 --icn-sz
を設定することでいったん解決した。これで width
,height
を設定し,基本的に各数値は比率で設定する。border-width
などパーセント指定が出来ない場合も var()
と calc()
を使って計算出来る。
当初,32px四方を基準に値を調整し,最終的に transform
の scale()
で縮尺を調整するということを考えたが,rotate()
などを使いたい時に組み合わせの数だけ transform
の記述が必要という問題があった。最近は scale
や rotate
という個別指定プロパティもあるが,対応舞覧の普及率にまだ若干難がある。