html - 如何在 div 中将图像和文本垂直对齐到中间

Question

例如:http://jsfiddle.net/S23ut/1/

我希望图像和文本与其容器的中间垂直对齐。我似乎无法为此获得正确的 CSS。有什么想法/技巧吗？

Answer 1

我不确定跨浏览器的兼容性，但使用 CSS display: table-XXX 可能有效:

#offer_widget .row {
    display: table-row;
}

#offer_widget .row_image {
    display: table-cell;
    text-align:center;
    vertical-align: middle;
}
#offer_widget .row_text {
    display: table-cell;
    vertical-align: middle;
}

参见 this update to your jsFiddle .