IEで出来をチェックしていたページを、Firefoxで見たら「これはひどい」。「後方互換」と「標準」の違いを頭に叩き込まないとダメだったのだ。ITでメシを食っているとも思えない酷い有様だ。死ねばいいのに自分
#test {
width: 100px;
padding-left: 5px;
border-left: 1px solid #000000;
}同じwidthとpaddingとborderを指定したcssでもモードの違いによって解釈が異なる。
標準モード(width,heightにpadding,borderが「含まれない」)
実際に占有する領域は106ピクセル(100 + 5 + 1)、100ピクセルの外にpaddingやborderがある。
当然後方互換」はいずれ消えるべきものである。標準モードで表示させるにはhtmlファイルにDOCTYPE宣言を忘れずにいれる事。
HTML 4.01 Strict(厳密型)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional(移行型)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset(フレーム利用型)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
主に3つの形式があるが、HTML 4.01の仕様に忠実なStrictが推奨される。Transitionalは文字通り「移行途中」の形式なので最終的にStrictに合わせる事。
