删除Google+,Facebook和Twitter按钮之间的空白区域

Kno*_*s X 3 twitter facebook google-plus

我希望我的社交媒体按钮(带有气泡计数)彼此相邻,但相反,它们之间会有一个随机的空白区域.有没有办法删除它?

这是当前的代码:

{literal}

<!-- Place this tag where you want the +1 button to render -->
<g:plusone size="medium"></g:plusone>
<!-- Place this render call where appropriate -->
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);})();
</script>

<div class="fb-like" data-href="http://www.url.com" data-send="false" data-layout="button_count" 
data-width="40" data-show-faces="false" style="vertical-align:top"></div>

<a href="https://twitter.com/User" class="twitter-follow-button" data-show-count="true" 
data-show-screen-name="false" data-dnt="true">Follow @User</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>
{/literal}
Run Code Online (Sandbox Code Playgroud)

DMC*_*MCS 6

将每个插件包装在div中,并将其样式设置为style="overflow:hidden;width:50px;float:left;".使用50px或任何你想要的宽度.然后你需要一个最后的div来<div style="clear:both" />在你的最后一个插件的div标签之后产生一个"回车/换行" .

  • 一旦计数气泡累积到足以将推特/谷歌+按钮所需空间超过50px或60px或您设置的任何硬值,这个解决方案将无法正常工作.(为每个使用twitter/google +按钮的项目更改这些px值,以便手动看起来不错,这将是一项不可能完成的任务) (5认同)