div入れ子、親でmarginを設定すると子のmarginは反映されない？

段組みレイアウトでdivが
入れ子になってています。
外側が
<div id=wrap>
<div id=main>
<div id=form>
</div>
</div>
</div>

#wrap{
width: 840px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 15px;
margin-left: auto;
}
#main {
width: 582px;
float: right;
padding: 0;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 10;
}
#form {
width: 562px;
padding: 0;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 20;
}
としてあります。
id=formのmargin-left :20;
だけがブラウザで反映されず、
flort:right;で右に寄せて左に20pxあけました。
id=mainもflort:right;で右に寄っているだけだったようです。

divを入れ子に使う場合、
親でmarginを設定したら、子のmarginは反映されないのでしょうか？

No.1 ベストアンサー 回答者： aboutworks 回答日時： 2009/03/28 17:32

margin-left: 20;

ではなくて、
margin-left: 20px;
と書いたら、反映しませんか？

この回答へのお礼

反映しました。見落としでお手数をかけてすみませんでした。
このpxの見落としと、IEのmarginの問題が絡んで、混乱しきっていました。
ありがとうございます。

お礼日時：2009/03/29 02:15

No.4 回答者： noname#83877 回答日時： 2009/03/28 22:57

IEの仕様が微妙なので親要素のボックスに向けて(？)の内側からのmarginよりもpaddingで余白を取る方がいいと思います。

場合によっては親要素にmarginが継承されてしまう場合もあるので・・・

この回答へのお礼

ありがとうございました。確かにそのようです。
IEで内側のmarginがとれないのがpaddingを使うことでうまくゆきました。
他の方に指摘頂いた、pxの記入漏れとあいまって混乱していましたが、
スッキリしました。

お礼日時：2009/03/29 02:21

No.3 回答者： coopy72v 回答日時： 2009/03/28 22:52

私の環境ではですが

mainのfloat:right;をはずせば普通にマージン取れていました。
下の方も書いていらっしゃいますが、マージンをあけるときはpx等、
単位は書いたほうがよいかと思います

mainを右周り込みにするということは、左の20pxの隙間に何かを入れたいのでしょうか？
右のスペースに何かを回りこませるならば、float:left;　かな？

ついでですが、上下左右すべて指定するならば
margin:(top) (right) (bottom) (left);と並べて書けばできますよ＾＾

回答に勘違いがあったら　申し訳ないです；

この回答へのお礼

ありがとうございます。
marginがとれました。これでfloat:left;でもOKでした^^

お礼日時：2009/03/29 02:17

No.2 回答者： noname#119508 回答日時： 2009/03/28 19:49

通常は反映されるはずです。

ですがNo.1の方もいっている通り、『px』の文字が抜けてると表示できないことがあるようです。
あと、id=○○じゃなくてid="○○"にした方が良いですよ。

この回答へのお礼

こまかい見落としで、苦労してるだけなんですね。
ブラウザによって大丈夫だったりするので、ブラウザの問題にしてしまいがちですが自分が悪いんですね。
ご指摘ありがとうございます。

お礼日時：2009/03/29 02:19