如何在HTML中垂直对齐元素

我有一个按钮，旁边有一些文字，像这样

----------------
|              |
|    Button    |     Text
|              |
----------------

我想让文本垂直对齐按钮的中心。我应该如何在CSS中做到这一点

以下是我的尝试：

我发现这种方法存在两个问题：

在IE 6中，文本显示在顶部

这两个元素从父div流出，因此此布局将干扰其他div

---

要垂直居中文本，请将行高设置为与高度相同，例如：

#form-actions{ height: 30px; }
#text{ line-height: 30px; }

并将“垂直对齐”设置为“中间”：

---

只要您尝试垂直对齐的元素及其所有同级元素都是

inline

或

inline block

，只需使用

vertical align:middle

---

预览：

CSS中没有

垂直对齐

属性。你是说垂直对齐吗？另外，请注意，

vertical align

对

display:block

的元素没有影响，只对内联流动的元素（

display:inline

或

inline block

和一些很少使用的其他元素）和表格单元格（其行为与内联元素截然不同）有影响。

#text{ line-height: 30px; vertical-align:middle; }