如何在div中对齐文本

Question

我是HTML / CSS的新手，过去一小时都在尝试做一些显然超出我的事情。我一直试图将div中的电影文本略微向上，以便与某些图像对齐。

http://jsfiddle.net/xE2qJ

<div class='social-media-button'> <a href='www.facebook.com/#' target='_blank'><img border='0' src='http://www.niftybuttons.com/authentic/color-square/facebook.png'/></a> Hello <a href='www.youtube.com/#' target='_blank'><img border='0' src='http://www.niftybuttons.com/authentic/color-square/youtube.png'/></a> </div>    

我怎样才能做到这一点？

Answer 1

你可以用

解决它

  

display：inline：block

和

  

垂直对齐

HTML（我将文字包裹在一个范围内）：

          

<span>Hello</span>

             

CSS：

  

a，span {vertical-align：middle; display：inline-block;}

DEMO：http://jsfiddle.net/xE2qJ/1/

Answer 2

人们会为此而火焰但是对于这样的事情，我更喜欢使用桌子。最简单的方法来完成垂直对齐。

另一个选择是检查图片高度并将line-height + height设置为该值。