无法将社交媒体分享按钮排列在内嵌列表中

对于我而言，我无法将这些社交媒体分享按钮与我的内联列表对齐。我几乎在<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

无法将社交媒体分享按钮排列在内嵌列表中

回答

相关问题