调整外部div大小时如何避免内部div溢出？答案

【问题标题】：How to avoid overflow of inner div when resize the outer div?调整外部div大小时如何避免内部div溢出？
【发布时间】：2014-10-17 03:13:58
【问题描述】：

innerMain 在我调整外部 div (main) 的大小时自动调整大小。我希望header 和footer 都保持在main div 的顶部和底部。两者都应该是块元素 - display=block - 并且仅在 main 更改时调整 innerMain 的大小。我目前的解决方案是导致底部溢出。有人可以帮我将所有内部 div 放入外部 div 并避免溢出吗？

我无法使用 jQuery UI Resizable 的 resize 选项，因为我在绘制外部 div 时不知道内部 div 的 Dom 元素。（最终的 Dom 结构不可用）。计算任何像素大小也不是我的解决方案。

jsfiddle 链接：http://jsfiddle.net/gHLgt/16/

【问题讨论】：

标签： javascript jquery html css jquery-ui

【解决方案1】：

您这里有几个问题可以通过如下添加/编辑来解决：

.main { position: relative; }
.footer { position: absolute; bottom: 0; width: 100%; }

然后将您的 jquery 应用到内部 div 而不是外部包装器：

$(".innerMain").resizable();

小提琴：http://jsfiddle.net/gHLgt/18/

【讨论】：