100% 高度溢出容器 div答案

【问题标题】：100% height overflowing container div100% 高度溢出容器 div
【发布时间】：2012-02-04 12:00:15
【问题描述】：

我有一个高度和宽度设置为 100% 的 .video div。但目前，.video div 的高度“溢出”了包含它的 .stream div（似乎它增加了 .top div 的高度）。

为了澄清，我试图让 .video div '填充' .stream div，没有任何重叠/溢出。

有什么想法吗？

谢谢。

编辑：通过让 .top div float: left 并将其宽度设置为 100% 来解决它。删除 .top div 上的填充，而是直接将填充添加到段落元素，最后从 .video div 中删除 float: left。 http://jsfiddle.net/pyQMb/

【问题讨论】：

外部容器有填充吗？你能提供一些代码吗？

标签： html css

【解决方案1】：

如果你有浮动问题，我建议你看看 clearfix：

http://www.webtoolkit.info/css-clearfix.html

将 class="clearfix" 添加到父元素到任何浮动元素。

如果不使用 css 将高度固定为绝对值，则可以解决问题。

【讨论】：

流div可以调整大小，所以div的高度会变化。

【解决方案2】：

我不能 100% 确定您要完成什么，但我假设您希望 .video div 位于 .stream div 内，而不是溢出到它之外。如果是这种情况，请像这样将 overflow: hidden; 添加到您的 .stream 类中。

.stream {
    position: absolute;
    left: 100px;
    top: 100px;
    border: 1px solid #333333;
    width: 400px;
    height: 300px;
    color: #FFFFFF;
    overflow: hidden;
}

如果这不是您想要完成的，请在您的问题中添加您想要完成的内容。

【讨论】：

不，这不是我想要的。我正在尝试让 .video div 填充 .stream div。
目前，它正在重叠。这不是我想要的。隐藏溢出并不能解决问题。
请用您的预期结果更新问题。