无法让社交媒体共享按钮在内联列表中排列

2024-02-08

在我的一生中,我无法让这些社交媒体分享按钮与我的内嵌列表对齐。我差点就拥有了它vertical-align: top; on the <li>但 Chrome 不喜欢这样。

页面可以在这里看到:http://206.72.114.49/sharelinkstest.htm 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>

设置 Facebook 的高度iframe到 20px 似乎可以解决问题。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

无法让社交媒体共享按钮在内联列表中排列 的相关文章