jquery - 填充剩余垂直空间的第二个元素

Question

我有一个固定高度的容器。

容器有 2 个段落。

我希望第一个 p 具有动态高度(具有最小高度和最大高度)，具体取决于它的内容，第二个 p 占据剩余的垂直空间。

例如 this fiddle : 我希望粉红色的 p 填充剩余的黄色空间，并在第一个 p 元素增长时相应缩小。

我已经看到如何让 div 填充水平空间(即使用 bfc - block 格式化上下文)但我似乎无法找到垂直填充的 css 解决方案。

如果这不能用 css 完成，我想知道如何用 jquery 做到这一点。

谢谢。

Answer 1

你可以像这样使用第二个粉红色的div

.two
{
    background-color: pink;
    height: inherit;
}

See this Fiddle