css - 画像 HTML を使用したテキストの配置

Question

ここで小さな問題があります。私は Div を持っており、テキストを中央のどちらかの側に浮かせたいと思っています。

私は現在それのスクリーンショットを含めていますが、これが達成可能かどうか、または実際の画像にする必要があるかどうか、誰にもわかりますか?

JS フィドル >> http://jsfiddle.net/DU4u4/

Answer 1

あなたはで試すことができますvertical-align: middle

Answer 2

...................................................

今line-heightではこれに慣れています

Answer 3

うまくいけば、これはあなたが必要とするものです...

デモをチェック

HTML

<div id="socialConnect">
    <div class="fbConnect">Follow us on</div>
    <div class="twitterConnect">OR</div>
</div>

CSS

.fbConnect{
    background-image:url('http://www.seedaneed.com/images/fb_btn.png');
    background-repeat:no-repeat;
    background-position:right;
    height:32px;
    width:125px;
    float:left;
    padding-top:10px;
}

.twitterConnect{
    background-image:url('http://www.boson.com/images/twitter-button.jpg');
    background-repeat:no-repeat;
    background-position:right;
    height:32px;
    width:60px;    
    float:left;    
    padding-top:10px;
    padding-left:5px;
    text-align:left;
}