今年に入って、このブログのリニューアルを裏でぽちぽちとやっています。
テーマTwentytwelveをベースに少しだけカスタマイズしようと思っているのですが、ちょっと戸惑ったのが
font-size: 0.785714286rem;
などの中途半端な数字と、見慣れない「rem」という単位。
「rem」に関しては、以前少し見かけたことがあるのですが、ちゃんと調べてみると、
「em」は親のfont-sizeに相対的で、複利計算され問題を起こすことがあります。「rem」では常にルート（またはhtml要素）に相対的となります。 これは、html要素にフォントのサイズを一つ定義し、すべての子要素を「rem」で定義することができます。
ということで「rem」は、文字サイズ等を相対指定できる、CSS３から取り入れられた単位。
Twentytwelveの場合、ベースの1remを100％、14xに設定してあるので、いろいろなところで中途半端な数字が出てきてしまっている様子。
普通の使い方だと、ベースを62.5%、10pxにして、14px = 1.4rem,、といったように使う方が解りやすい。
ということで、いったんTwentytwelveのCSSのベースをベースを62.5%にして書き換えてみました。
IE9-に対応させるためのpxの値を1/10にしてremの値を書き換えたのですが、それだけだと少し不具合があっていろいろ修正してそれなりに修正できました。
しかし、よく考えてみると現時点で「rem」を使うメリットというのが今ひとつ不明。
px単位だと、IEにおいてブラウザの機能で文字のサイズを変更出来ないとのことだが、自分があまりIEを使わないのでその辺りの利点があまり感じられません。
とりあえず、もうしばらくはpx単位指定でいいじゃないかと、思うのですが。
