Html 如何拉伸垂直div元素以填充父容器？

我有以下几点

左上角
左上下
居中
右上角
右上下

在没有明确设置高度和绝对位置的情况下，如何使垂直对齐的div，如下所示：

编辑：请不要建议我使用表，因为我需要解决上面示例中的问题

与当前标记一起使用如何：

CSS

---

将其添加到样式表中：

.column:nth-child(2) .cell {
    padding-bottom: 18px;
}

---

这是九种解决方案，但是否可以防止边框：无？试试这个--我删除了边框：无，而是-只在必要时在单元格上设置边框谢谢解决方案，但现在如果中间块的内容多于其他内容，则会出现以下问题。“修好了吗？”路人埃里克特别指出没有设置高度和没有桌子。这是一个很难的问题，如果有正确的答案的话，知道它会很好。我一直不明白为什么100%的流体高度容器不能工作，而浏览器显然知道它是什么。@guymid在CSS3 flexbox模型中，你可以更容易地做到这一点——但现实世界中flexbox的支持是混乱的。所以，是的，您指出这是一个困难的问题，即使并没有表请求（这是编辑添加的，不是最初发布的），表也可能最终会被使用。我可以同意卡利的反对票，但其他的都是解决方案；他们可能有缺陷，但我的也有。没错。我想所有的网络开发人员都需要这个解决方案。我不能使用显式的值。你说没有高度和表格。与显式值无关

.container {
    display: table;
}

.column {
    display: table-cell;
    vertical-align: top;
}

.cell {
    border: 1px solid #000;
    width: 100px;
    font-size: 13px;    
}
.column:nth-child(2)
{
    border: 1px solid #000;
}
.column:nth-child(2) .cell
{
    border: none;
}

.column:nth-child(2) .cell {
    padding-bottom: 18px;
}