無法將社交媒體分享按鈕排列在內嵌列表中

對於我而言，我無法將這些社交媒體分享按鈕與我的內聯列表對齊。我幾乎在<li>上使用vertical-align: top;，但Chrome不喜歡這樣。無法將社交媒體分享按鈕排列在內嵌列表中

頁可以在這裏看到：http://206.72.114.49/sharelinkstest.htm

全HTML/CSS如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <style type="text/css"> 
     .share-links { 
      margin: 8px 0 0 0; 
      padding-left: 0; 
      display: inline; 
     } 
     .share-links li { 
      margin-left: 0; 
      padding-right: 15px; 
      list-style: none; 
      display: inline; 
     } 
    </style> 
</head> 
<body> 

<ul class="share-links"> 
    <li><a title="Post to Google Buzz" class="google-buzz-button" href="http://www.google.com/buzz/post" data-button-style="small-count" data-url="$fqUrl$post.Url"#if ($macros.IsNotNull($post.ResolvedImageUrl)) data-imageurl="$fqUrl$post.ResolvedImageUrl"#end></a><script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script></li> 
    <li><a href="http://twitter.com/share" class="twitter-share-button" data-url="$fqUrl$post.Url" data-text="$post.Title by $post.User.ProperName" data-count="horizontal" data-via="lifeorganically">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></li> 
    <li><iframe src="http://www.facebook.com/plugins/like.php?href=$fqUrl$post.Url&amp;layout=button_count&amp;show_faces=false&amp;width=80;&amp;action=like&amp;font&amp;colorscheme=light&amp;height=25" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:25px;" allowTransparency="true"></iframe></li> 
</ul> 

</body> 
</html>

來源

2010-08-27 Jeremy H

我也是用最長時間的內聯列表來使用社交分享按鈕，但我發現更好的結果切換到div，即使那時我從來沒有在所有瀏覽器上都完美，但最終我沒有給出。 ..在我的個人主頁上。 – Muskie 2014-05-22 18:55:12

設置了Facebook iframe的爲20px高度，似乎這樣的伎倆。

來源

2010-08-28 00:51:15 derekerdmann

這似乎有很多伎倆。謝謝！ – 2010-08-28 13:21:11

無法將社交媒體分享按鈕排列在內嵌列表中

回答

相關問題