Right border of the AddThis counter missing with T

2020-02-14 18:28发布

When using the default code from http://www.addthis.com/ with Twitter's Bootstrap 3 the right border of the counter is missing:

Addthis buttons and counter with Twitter's Bootstrap 3

1条回答
\"骚年 ilove
2楼-- · 2020-02-14 18:43

Twitter's Bootstrap 3 use a CSS's universal selector to set box-sizing (see: https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing) to border-box. This will be save cause support for IE7 has been dropped. This selector breaks the AddThis counter.

The counter is set by: <a class="addthis_counter addthis_bubble_style"></a>.

Solution: Reset the box-sizing for the .addthis_counter class. Add the following code after your bootstrap css:

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

Or Less:

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

See also: http://getbootstrap.com/getting-started/#third-parties and Why did Bootstrap 3 switch to box-sizing: border-box?

查看更多
登录 后发表回答