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

Example I have set the master div with 100px the height. In the div have one logo which I want it to be vertical-align:middle;

示例我将主div设置为100px的高度。在div中有一个徽标，我希望它是垂直对齐的：中间;

Here an example http://jsfiddle.net/c7Me7/

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

I want the logo will be auto align to middle without have a padding or margin.

我希望徽标会自动对齐到中间而没有填充或边距。

Output should be like

输出应该是

Let me know

让我知道

4 个解决方案

#1

UPDATED: This works.

更新：这是有效的。

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

see - http://jsbin.com/utuye5/2

请参阅 - http://jsbin.com/utuye5/2

#2

Please take a look at this page, it advices on several ways to solve this.

请看一下这个页面，它提出了解决这个问题的几种方法。

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

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

#3

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

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

use text-align:center

使用text-align：center

#4

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

Try this top can be adjusted as per need

尝试这个顶部可以根据需要进行调整

Thanks, Amit

谢谢，阿米特