html - Bootstrap 切割 ShareThis 按钮的一部分

Question

我正在尝试嵌入 ShareThis将代码写入使用 Bootstrap 创建的网站。

问题是由于某种原因，两个按钮的底部都被切断了，而且我似乎无法使用 Bootstrap 列偏移将按钮居中，因为使用这种方法似乎不可能使两个按钮完全居中。

这里的解决方案是什么？

  <div class="row">
    <div class="col-lg-12">
      <span class='st_facebook_vcount' displayText='Facebook'></span>
      <span class='st_twitter_vcount' displayText='Tweet'></span>
    </div>
  </div>

Answer 1

我不太熟悉 ShareThis 按钮，你有查看网站的链接吗？

关于居中，目前您使用的是 col-lg-12，这意味着它占据了 100% 的宽度，并且默认情况下内部的所有内容(您的按钮)将保持对齐。您不一定需要使用 Bootstrap 列偏移量，而只需将跨度放在包装器中，如下所示。您可以在此处找到有关 Bootstrap 网格的更多信息 http://getbootstrap.com/css/#grid .

<div class="row">
  <div class="col-lg-12">
    <div class="social-wrapper">
      <span class='st_facebook_vcount' displayText='Facebook'></span>
      <span class='st_twitter_vcount' displayText='Tweet'></span>
    </div>
  </div>
</div>

然后将 text-align:center 添加到包装器中。

.social-wrapper {
    text-align: center;
}

在这里查看 JSFiddle:https://jsfiddle.net/hez7pqbo/