Html 填充剩余空间（CSS）

我已经创建了一个JSFIDLE：

我有三个div。父级、标题和内容。标题的高度是未知的，content div应该填充剩余的空间

---

我尝试了

高度：100%

，但这不是我所期望的。

尝试浮动标题：

#head {
    background: green;
    float: left;
    width: 100%;
}

---

尝试浮动标题：

#head {
    background: green;
    float: left;
    width: 100%;
}

---

浮动标题效果很好（不知道为什么布莱斯的答案会被否决）

HTML:

还有工作

[编辑]

---

将

#content

的

高度更改为
最小高度
 浮动标题效果很好（不知道为什么布莱斯的答案会被否决）

HTML:

还有工作

[编辑]
将
#content
的
高度更改为
最小高度
 它很有创意，也很简单。我喜欢！它很有创意，也很简单。我喜欢！对于
#content
元素，您应该使用
minheight:100%
而不是
height
，以解决背景色问题@HashemQolami，你是对的，我自己也看到了，并修复了：）当我将长内容放入content div并将其设置为overflow-y:auto时，这会解除链接。你应该使用
min height:100%
而不是
height
来修复背景颜色问题@HashemQolami，你是对的，我自己也看到了，并且修复了：）当我将长内容放入content div并将其设置为overflow-y:auto时，这会解除链接。
html, body {
    margin: 0px;
    height: 100%;
}
#parent {
    background: red;
    height: 100%;
}
#head {
    background: green;
    width: 100%;
    float: left;
}
#content {
    background: yellow;
    min-height: 100%;
}