问题描述:

i have this three divs i just want to know how to position multiple divs in 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/

why yellow div is not top:10 like blue div?

And what is better for using : position relative or margins for working with divs.

网友答案:

i think he want this

fiddle: 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;
}
相关阅读:
Top