css - Twitter 的 Bootstrap 3 中 AddThis 计数器的右边框丢失

Question

使用 http://www.addthis.com/ 中的默认代码时在 Twitter 的 Bootstrap 3 中，计数器的右边框丢失了:

Answer 1

Twitter 的 Bootstrap 3 使用 CSS 的通用选择器将 box-sizing(请参阅: https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing )设置为 border-box。这将是保存，因为对 IE7 的支持已被删除。此选择器会破坏 AddThis 计数器。

计数器设置为:<a class="addthis_counter addthis_bubble_style"></a> .

解决方案:重置 .addthis_counter 类的框大小。在 bootstrap css 之后添加以下代码:

 .addthis_counter
{
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
      box-sizing: content-box;
}

或更少:

.addthis_counter,
.addthis_counter * { .box-sizing(content-box); }

另请参阅:http://getbootstrap.com/getting-started/#third-parties和 Why did Bootstrap 3 switch to box-sizing: border-box?