css - div 在另一个内部的垂直对齐 - 问题

Question

我最初有 float div，我希望这些 float 中的内容垂直对齐。

这给我带来了麻烦，所以我不得不移除 float 。

我是绕过这个 fiddle本文中提到 post .

并使用 fiddle 获得所需的布局。但是我在垂直对齐 div 时遇到了麻烦。

我试过了，

vertical-align:middle;
display:table-cell;

对于 parent 容器和

display: inline-block;

对于 child 内容。

1) 在这个fiddle .我希望 right 在 right-container 内垂直对齐。

换句话说。我想让 两个 div 在 main div 中垂直对齐，并且两个 div 中的每个 div 都需要垂​​直对齐。

2) 如何在 float 内实现垂直对齐？所以我可能不会改变我原来的布局。在 fiddle 的右边和左边说 floats。

需要一些指导。

编辑:

这对于表格来说可能更简单。但我正在寻找基于 div 的解决方案。

Answer 1

这是你想要的吗？

已添加:<div id="right" style="display:table-cell;vertical-align:middle;"> RIGHT </div>

jsFiddle 更新:http://jsfiddle.net/5vpA3/157/