如何对齐垂直div？

Question

你能帮我垂直对齐（蓝色背景）文字和图标（fb等）吗？ 我尝试使用vertical-align，display：table等。但它并没有解决我的问题。

http://tinyurl.com/pe4avff

请帮帮我。谢谢！

Answer 1

您可能没有以正确的方式使用display和vertical-align属性。

使用以下样式：

.align {
    display: table;
    height: 100%;
    ...
}

.vertical {
    display: table-cell;
    vertical-align: middle;
}

另请注意，这是垂直对齐的常见做法，但不是唯一的做法。

Answer 2

你也可以这样做：

.vertical {
display: table-row;
line-height: 2em;
}

这基本上是将div中文本的行高设置为与div高度相同的值。

Answer 3

从CSS类bar-menu-left，bar-menu-right和bar-icons中删除float：left。

Answer 4

如果你要做的是垂直对齐你应删除的所有文字和图标

来自float:left;，.bar-menu-left和.bar-menu-right类的

.bar-icons。