CODEWITHSUNDEEP
htmlcss
user2486535
user2486535

Reputation: 428

adjusting position of a div based on its previous div, which is rendered dynamically

I am having two div's next to each other, first one will be rendered on Ajax call and will be filled with more content, so its content height is not known.

I want the second div to always appear at the bottom of first div regardless of the first div's height, I mean: after the Ajax call rendering completes, the second div should be positioned immediately under the first div.

Will something like this work?

Note: I am not applying the below CSS. I gave it as an example.

.seconddiv
{
    position: relative;
    top:  (top of first + height of first);
}

Upvotes: 0

Views: 152

Answers (2)

avrahamcool
avrahamcool

Reputation: 14094

you don't have to set anything. this is the default behavior of block elements: to be stacked one after each other.

sometimes, less is more.

Here is a Working Snippet for you to try. [notice the empty CSS panel except outlining, that is for you to see that the positioning works]

Upvotes: 1

dolly
dolly

Reputation: 86

Try this, it worked for me

keep the position of the dynamically generating div as static

position:static

Now give the position property for next div as absolute

position:absolute

and then give your "top" or "margin-top" whichever you are trying with

Upvotes: 0

Related Questions