如何将官方的 google +1 和 facebook like/share 按钮放在同一行？答案

【问题标题】：How to put the official google +1 and facebook like/share button in the same line?如何将官方的 google +1 和 facebook like/share 按钮放在同一行？
【发布时间】：2015-05-04 03:06:17
【问题描述】：

我不知道是什么原因不想把它们放在一行，这会浪费我的空间，我想把它们放在同一行但不使用3方按钮，唯一的方法我可以使用 is table，但不会响应，请帮助，谢谢！

【问题讨论】：

你有没有考虑过没有这些按钮，没有人喜欢，也有人监视？
我不这么认为，谢谢！

标签： javascript css button web share

【解决方案1】：

这是你要找的吗？

将按钮包裹在<div>s 中，并设置样式display:inline-block;
确保父样式有font-size:0px，否则facebook图标会不合适。

这是代码，从<body>开始：

<body>
  <!-- Buttons -->
  <div class="sharing-buttons" style="font-size:0px">
    <div style="margin-right: 4px; display:inline-block;">
      <div class="g-plusone" data-size="medium" data-annotation="none"></div>
    </div>
    <div style="display:inline-block;">
      <div class="fb-like" data-href="https://benzhang.xyz" data-layout="button" data-action="like" data-show-faces="true" data-share="true"></div>
    </div>
  </div>

  <!-- Scripts -->
  <div id="fb-root"></div>
  <script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3&appId=809268315782757";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>
  <script src="https://apis.google.com/js/platform.js" async defer></script>
</body>

如果需要任何澄清，请随时发表评论。

【讨论】：