为什么这个CSS边缘顶部样式不工作?

我尝试在另一个div内的一个div上添加边缘值。所有工作都很好，除了顶部值，它似乎被忽略了。但是为什么呢?

我的期望是:

我得到的是:

代码:

#{外宽度:500 px; 身高:200 px; 背景:# FFCCCC; Margin: 50px auto 0 auto; 显示:块; ｝ #{内部背景:# FFCC33; Margin: 50px 50px 50px 50px; 填充:10 px; 显示:块; ｝ < div id = "外" > < div id = "内部" > 你好世界! < / div > < / div >

W3Schools没有解释为什么margin会这样。

当前回答

不太清楚为什么，但改变内部CSS为

display: inline-block;

似乎有用。

2012-03-01 16:22:36

其他回答

尝试使用display: inline-block;在内部div上，就像这样:

#outer {
    width:500px; 
    height:200px; 
    background:#FFCCCC;
    margin:50px auto 0 auto;
    display:block;
}
#inner {
    background:#FFCC33;
    margin:50px 50px 50px 50px;
    padding:10px;
    display:inline-block;
}

2012-03-01 16:20:53

试试这个:

#{外宽度:500 px; 身高:200 px; 背景:# FFCCCC; Margin:50px auto 0 auto; 显示:表; ｝ #{内部背景:# FFCC33; Margin:50px 50px 50px 50px; 填充:10 px; 显示:块; ｝ < div id = "外" > < div id = "内部" > 你好世界! < / div > < / div >

好运！

2012-03-01 19:44:27

不太清楚为什么，但改变内部CSS为