如何在图像上正确设置垂直居中对齐

Question

示例我将主div的高度设置为100px 。 在div中，有一个我想要vertical-align:middle;徽标vertical-align:middle;

这是一个示例http://jsfiddle.net/c7Me7/

我希望徽标将自动对齐到中间而没有padding或margin 。

输出应该像

让我知道

Answer 1

更新：这行得通。

#top { height:100px; background:#000; padding:0 20px;line-height:100px;}
#logo img {vertical-align: middle;}

看到-http://jsbin.com/utuye5/2

Answer 2

请查看此页面，它提供了解决此问题的几种方法的建议。

http://blog.themeforest.net/tutorials/vertical-centering-with-css/

Answer 3

http://jsfiddle.net/c7Me7/7/

使用text-align：center

Answer 4

#top { height:100px; background:#000; padding:0 20px;position:relative}
#logo {position:absolute;top:30% }

尝试此top可以根据需要进行调整

谢谢阿米特