user893970
user893970

Reputation: 899

css positioning - right below of a certain div

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

Answers (2)

Piyuesh
Piyuesh

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

ASR
ASR

Reputation: 1811

I hope this is somthing you want

http://jsfiddle.net/mj6Tu/

Upvotes: 1

Related Questions