Question

我真的无法重现我的问题，因此我只是发布了当前网站上发生问题的链接：here。

我试图截断.event-description - div的内容，如果其内容大于div。因此，.event-description - 类的定义如下：

.event-description {
    height: 70%;
    overflow: hidden;
}

但是如果内容大于初始宽度和高度（基于浏览器的分辨率），内容确实被截断，但所有其他父div也增加了它们的高度。我正在使用bootstrap 3以及一些jquery库，所以问题可能源于那里。

编辑：This屏幕截图显示了正确div的内容没有溢出时的默认行为和想要的行为。 This屏幕截图显示了不需要的行为。内容确实被截断，但由于一些奇怪的原因，所有其他元素增加了它们的高度，这不应该发生。

Answer 1

将.col-md-4更改为

.col-md-4 {
    max-height: 70%;
    background-color: rgba(0,0,0,0.7);
    color: rgb(255, 255, 255);
    overflow: hidden;
    padding-bottom: 20px;
}

并删除您自己插入的规则，即这些规则：

.event-description {
    height: 70%;
    overflow: hidden;
}

尽管应用我添加到event-wrapper类的规则可能会更好，因为您可能不想干扰框架的默认CSS。

如果内容被截断，则父元素的高度会增加

1 个答案: