[PR]テレビ番組表
今夜の番組チェック

 

 

ポジショニングとの違い

マージンとパディングについて

Page Top ▲

Box Properties About

マージンやパディングとポジションプロパティーを使用して配置した場合、ブラウザでの表示は同じです。
しかし、個々のプロパティーの考え方は異なります。使用を間違えると、イメージどおりに表示されないといった事が起きます。

 

マージンやパディングとポジショニングの違い

マージンやパディングで、要素を配置することができますが、ポジションとは考え方が違います。 マージンやパディングは、要素と要素の間隔を空けたりして調節するもので、ポジションのように要素自体をを配置するものではありません。

 

マージンとパディングの違い

マージンとパディングは、表示上効果が同じに見えますが、スタイルシートのボックスの定義は図のようになっています。
要素と罫線(ボーダー)の間がパディング、罫線とボックスまでの間がマージンです。
パディングは、罫線までの間隔。マージンは、罫線からの余白です。余白ですから背景は透明になります。
Internet Explorerのボックスは、罫線の太さの分拡張されます。例えば、300pix×300pxのボックスに1px罫線を引いた場合、302px×302pxの大きさになるようです。