ブラウザでWebサイトを正しく表示させるとデザイン限られる

ブラウザによってWEBページの表示が若干異なることに関しては、以前の記事で取り上げた。

関連記事:同じレンダラであってもブラウザによってサイト表示が異なる

「margin」や「padding」などの表現ルールに、各ブラウザで違いがあることは以前から知っている。

対処方法として、リセットCSS(「「HTML5 Reset Stylesheet」」)を導入したり、HTMLファイルの文書型宣言を「Strict / strict.dtd」から「Transitional / loose.dtd」に変更してみたが、どちらの方法もフッダーの余白幅に変化がなかった

よって、多くのブラウザ(ここでは、Internet Explorer,Chrome,Firefox,Safari,Operaを指す)で問題なく表示させるには、使用できるタグはもちろん、ページのデザインもだいぶ限られてしまうのではないかと感じた。

P.S.

先ほど見つけたやり方が有効かもしれないので、明日以降に試してみようと思っている。

例えば、「margin-bottom」を10pxで設定したら、「padding-top」を-10pxと設定するといった方法だ。