CSS1/CSS2ではボックスの幅や高さにパディングやボーダーのサイズは除いて計算されます。
ところがInternet Explorerではこれらを含めて幅や高さを計算します。
CSS3の仕様では、パディングやボーダーを含めて計算することもできるようになるようです。
IE7では起こらないようです。
例
HTML4.01 標準
HTML4.01 互換
XHTML 1.0 XML宣言あり
XHTML 1.0 XML宣言なし
[参考記事] IE6でXML宣言を記載すると互換モードとなる
[参考記事] body要素をはみ出す内容領域が表示されない
対象ブラウザ
Windows
Internet Explorer5.5以下
Internet Explorer6（互換モード）
Netscape4
Mac
Internet Explorer5（classic）
Internet Explorer5.2以下（MacOSX）
（インライン要素をブロック要素にしたときだけらしい【要確認】）
回避方法
（１）
widthやheightを指定するときは、paddingやborderを指定しない。
（２）
他のブラウザのwidthやheightの指定よりも後に、それぞれのブラウザ用の指定で上書きする。
WinIE用の指定
条件付コメントを使用して、IEのみ別の指定をする。
[参考記事] 条件付コメント
標準モード
互換モード
Mac用の指定
MacIEでは読み込まないハックを使う。
次のコメントで囲まれた指定はMacIEでは読み込まない。
文法違反ではない。
〜〜〜
/* */
例
width: 200px;
height: 100px;
/* \*/
width: 180px;
height: 80px;
/* */
関連プロパティ
paddingパディングに関する指定をまとめて行う
padding-bottom下パディングを指定する
padding-left左パディングを指定する
padding-right右パディングを指定する
padding-top上パディングを指定する
borderボーダーのスタイル・太さ・色を四方まとめて指定する
border-bottom下ボーダーのスタイル・太さ・色を指定する
border-bottom-width下ボーダーの太さを指定する
border-left左ボーダーのスタイル・太さ・色を指定する
border-left-width左ボーダーの太さを指定する
border-right右ボーダーのスタイル・太さ・色を指定する
border-right-width右ボーダーの太さを指定する
border-top上ボーダーのスタイル・太さ・色を指定する
border-top-width上ボーダーの太さを指定する
width幅を指定する
height高さを指定する
主要ブラウザに非対応
