2014年6月22日(日) 09時56分39秒 [仕事]

widthプロパティを100%にすると「はみ出す」のを防ぐbox-sizingプロパティ

スタイルシートを使って、画像やボックスなどを横幅いっぱいに広げる目的で、widthプロパティの値（＝横幅）を「100%」と指定すると、なぜか親ボックスの領域（表示領域）からはみ出してしまう……という現象に遭遇することがあります。
このとき、意図せずはみ出てしまうのは、CSSでのwidth（＝横幅）の『解釈』が原因かも知れません。

スタイルシートで細かくデザインしている際などにたまに遭遇する「微妙にはみ出してしまう」現象について、その原因と、box-sizingプロパティを使って解決する方法をAll Aboutで解説しました。

■横幅を100%にした際、親ボックスからはみ出すのを防ぐ（＠All About ホームページ作成）

この方法を覚えておくと、「微妙にはみ出してしまう」問題に遭遇しても、イライラする頻度を減らせるかも知れません。(^_^;;;