最近はスマートフォンを利用する人が多くなっていますので、クロスブラウザ・レスポンシブ対応で作成するのが主流です。
制作するときは Chorme や Safari で制作することが多いので最近まで気づきませんでした。

Firefox で、下記のスタイルシートの指定が関連すると、レイアウトが崩れてしまうことがあります。

font-size:80%;
width:60%;

どうも、小数点以下の横幅指定で繰り上げられてしまうようで、inline-block の最後の要素が段落ちしてしまうようです。

いろいろ試した結果、下記のように font-size 指定を継承させると、なぜか大丈夫です。

body { font-size: small;}
#container {font-size:small: width:60%;}

不思議ですね。

Twitterでフォローしよう

おすすめの記事