みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

CSSでmarginを指定すると、表示の仕方がブラウザによって変わってしまいます。

はじめまして、CSS初心者です。

お聞きしたいことがあります。

---CSS---
body{
  margin:0px;
  padding:0px;
}

#formbox{
 width:750px;
 height:155px;
}

#box01{
margin-left:30px;
width:280px;
height:50px;
}

---HTML---
<div id="formbox">
<div id="box">ほげほげ</div>
</div>

というHTMLをIE6.0とfirefox1.5で表示させたときに、
<div id="box">のmargin-leftがIE6.0だと60pxぐらいになってしまいます。firefoxでは、30pxとられているようなのですが…。

IE6.0とfirefox1.5で誤差が生じしてしまうのはなぜなのでしょうか。

どなたかご教授お願いできないでしょうか。

よろしくお願い申し上げます。

投稿日時 - 2006-08-08 16:01:05

QNo.2327351

困ってます

質問者が選んだベストアンサー

どうも。
ブラウザによって、表示形式は若干異なります。特に、文字間の間や行間、ボーダーの幅などは若干ですが、違います。しかし、見た目に大きく崩れる事はありません。
今回の件は、ソースをコピペして実行してみたところ、問題はありませんでしたよ。IEでもFirefoxでも同じように表示されました。
しかし、気になる事が1つある。それは、HTMLにおいて、id="box"ではなく、id="box01"でしょ?
ま、ここに記述する時に誤った事であって、実行する時には間違っていなかったと思いますが。

投稿日時 - 2006-08-08 16:21:17

お礼

早速のお返事ありがとうございました。
若干、実際のソースと違う部分はあったのですが、同じように表示されましたか。
floatを使用しているとき、marginを指定すると2倍になるというIEのバグが原因でした。
ちゃんと記述せず申し訳ありませんでした。

そうですね、"box01"ですね。
次回から質問するときは、気をつけて書き込もうと思います。

ありがとうございました。

投稿日時 - 2006-08-08 18:56:07

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問