html - CSS 垂直对齐无法正常工作

Question

这里有一个 jsfiddle 链接供引用: http://jsfiddle.net/STmwz/4/

首先，只有最上面的 div。当用户单击编辑按钮时，我有一些 javascript 将顶部 div 替换为底部 div。问题是，当替换发生时，会出现轻微的抽动:所有内容都跳跃了几个像素。

我认为解决此问题的最佳方法是使顶部 div 垂直对齐。我为顶部 div 设置了一个高度，当底部 div 替换顶部时，该高度与底部 div 的高度相匹配。因此，如果两者垂直对齐，则不会跳转!

问题是，垂直对齐在顶部 div 上不起作用。

知道我能做什么吗？

Answer 1

我相信您想要垂直对齐的元素必须具有“内联”或“表格单元格”显示。

来源:https://developer.mozilla.org/en/CSS/vertical-align

这是一个工作示例:http://jsfiddle.net/STmwz/19/