css - 关于 div 位置

Question

我有这三个 div 我只想知道如何在 div 中定位多个 div：

<div id="myDIV" >
    <div id="child">
    </div>
<div id="child2">
    </div>
</div>

div#myDIV
{
position:relative;
width:300px;
height:300px;
background:red;
left:10px;
top:100px;
}

div#child
{
position:relative;
width:100px;
height:100px;
background:blue;
left:10px;
top:10px;
}

div#child2
{
position:relative;
width:100px;
height:100px;
background:yellow;
left:150px;
top:10px;
}

   http://jsfiddle.net/ynw5d/

为什么黄色 div 不像蓝色 div 那样 top:10？

还有什么更适合使用：使用 div 的相对位置或边距。

Answer 1

我想他想要这个

小提琴：http: //jsfiddle.net/NwSU4/

HTML：

<div class="outer">
   <div class="inner"></div>
</div>

CSS：

.outer{
    background-color: red;
    margin:100px;
    width:100px;
    height:50px;
    position: relative;
}

.inner{
    background-color: blue;
    width:50px;
    height:100px;
    position: absolute;
    top: -50px;
    left: 0;
}