Reputation: 899
I have created an id of an div element and tried to give these properties:
.bu
{
background: #eee; padding: 10px; position:absolute; margin: 0 0 15px 0;width:750px; -moz-box-shadow: 0 0 5px #666; -webkit-box-shadow: 0 0 5px #666;
}
And, right after this, i have created another div element with same id but the second div i have added appears at the middle of the first element.
Here is better explanation of the code segment:
<div style = "position:absolute; top:50px;">
<div class= "bu">
---something about height 200px
</div>
</div>
<div class="bu">
something
</div>
My idea is that the second div should appear right after where the first div ends. I could give the properties "position:absolute;top:250px;" to second div but, the contents of every div will be decided by the users and no certain height. Where am i missing?
Thanks
__ Not master in css __
Upvotes: 0
Views: 110
Reputation: 1056
few position property values are:
static: this is default, and it means element will flow normally i.e. left-to-right, and top-to-bottom. elements will positioned themselves without overlapping.
absolute: it means element will have specific position (left, top, etc..) according to it's parent element position. they might overlap with other elements, which can be solved using z-index property.
So you might want to create a parent element and give it position absolute...and create 2 inner divs without any position values.
see this code.... http://jsbin.com/welcome/20319/edit
Upvotes: 0