在可变高度div内垂直居中

Question

我有一个页面将中间分成两个垂直列，＃split-left和＃split-right。每列占页面宽度的50％。

在左栏中是一个联系表格，如果字段数发生变化，其高度可能会有变化。

在右侧，我希望＃split-right的高度与＃split-left的高度匹配，文本垂直居中。

关于如何做到这一点的任何想法？

谢谢！

Answer 1

#regular-page { display: table; }
#split-left { display: table-cell; width: 50%; }
#split-right {
    display: table-cell;
    width: 50%;
    vertical-align: middle;
    background-color: #F7F7F7;
}

移动视图中的布局中断。您可以删除#content { width: 320px; }，但仍然会中断。