如何用css垂直对齐中间

Question

我想要一个垂直对齐的中间div

文字和图片未对齐

HTML

<div id="wrapper">
<span>    text </span><img src="read-mor-but.png" />
</div>

的CSS：

#wrapper {
    background: blue;
    height: 100px;
    text-align: center;
    display:table-cell;
    vertical-align:middle;
}

Answer 1

您还需要将vertical-align:middle添加到img代码

#wrapper img{
    vertical-align:middle;
}

Fiddle Demo

Answer 2

尝试添加line-height:100px以及您的代码 LINK

的CSS：

#wrapper {
    background: blue;
    height: 100px;
    text-align: center;
    display:table-cell;
    vertical-align:middle;
    line-height:100px;
}