CSS對齊的社會圖標 - 鉻/ Safari瀏覽器的具體

Question

我有一個客戶端頁面，在這裏我有我顯示了在Firefox偉大如下：

http://cl.ly/0u0h1S110f2J2N2E093d（截屏）

但是在Chrome和Safari它示出了這樣的：

http://cl.ly/0a132U3h1G2x1W3R0043（注意Facebook共享按鈕）

的代碼的按鈕是：

<div class="social"> 
    <div> 
    <div class="fb"> <a name="fb_share" id="fb_share" type="button"></a> 
     <script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> 
    </div> 
    <div class="twit"> <a href="https://twitter.com/share" class="twitter-share-button" data-lang="en">Tweet</a> 
     <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script> 
    </div> 
    </div> 
</div> 

我有以下的CSS，對於FF的偉大工程，但不是在其他兩個瀏覽器：

div.social div div {display: inline-block;} 
div.social div div.fb {margin-bottom: 1px;} 

我已經試過我能想到的得到這個工作屬性的每個組合，都無濟於事。

任何想法？

謝謝！

Answer 1

使用vertical-align: top：

div.social div div.fb { 
    vertical-align: top; 
} 

工作例如：http://jsfiddle.net/dFt8N/