如果绝对子 DIV 超出边界，CSS 调整父 DIV 大小答案

【问题标题】：CSS Adjust Parent DIV size if Absolute Child DIV falls outside boundaries如果绝对子 DIV 超出边界，CSS 调整父 DIV 大小
【发布时间】：2011-03-04 01:17:10
【问题描述】：

我有一个指定宽度和高度的父 div。如果我在其中有一个子 div，也就是在边界之外，有没有办法让父 div 调整大小以适应子 div？

前：

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

正如你在这个例子中看到的那样，子 div 会溢出底部的父 div 50px。我不想使用溢出：自动，因为那只会创建滚动条。我真的希望父div调整并添加50px的高度以补偿子div。

【问题讨论】：

标签： html css css-position

【解决方案1】：

看看这个。

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

您想将子级从父级顶部向下推 250 像素，所以不要使用top:250px。使用margin-top:250px; 和position:relative;

【讨论】：

该解决方案可能无法在所有情况下都按预期工作：如果将段落添加到开头，则边距位于段落和子 div 之间，而不是父 div 和子 div 之间，
@Prince 我更新了小提琴以允许调整宽度。看看内联 css 看看我做了什么。
@Aleksi 你是对的，但是根据给出的信息，这是一个可以接受的解决方案。如果需要，他可以绝对定位p。