Jeff Thomas
Jeff Thomas

Reputation: 4816

CSS Adjust Parent DIV size if Absolute Child DIV falls outside boundaries

I have a parent div that is a specified width and height. If I have a child div inside that, that is outside the boundaries, is there a way to make the parent div adjust size to fit the child div?

EX:

<div style="width:500px; height:500px; position:relative;">
  <div style="width:300px; height:300px; position:absolute; top:250px;">
    Some Content
  </div>
</div>

As you can see in this example the child div would overflow the parent div on the bottom by 50px. I do not want to use overflow:auto because that just creates scrollbars. I really want the parent div to adjust and add 50px in height to compensate for the child div.

Upvotes: 0

Views: 3097

Answers (1)

Kyle
Kyle

Reputation: 22258

Check this out.

http://jsfiddle.net/jURc9/8/

You want to push the child down 250px from the top of the parent so do no use top:250px. Use margin-top:250px; and position:relative;

Upvotes: 3

Related Questions