Facebook按钮在Firefox和Chrome上的呈现方式不同

Question

使用社交媒体“小工具”时，我的结果不一致，更具体地说是Facebook赞按钮。它在不同的浏览器上显示不同。

我正在尝试使用这两个小部件的“大”版本。虽然Chromium可以毫无问题地显示推特小部件的大小版本，但会显示一个完全不同的Facebook按钮。

乍一看，它似乎不是渲染问题，因为显然Facebook正在为小部件使用不同的源资源 - 注意白色的“f”和气球计数器。

造成这种情况的原因是什么？如何解决？

代码

<span class="fb-like"
data-size="large"
data-href="http://www.google.com"
data-layout="button_count"
data-action="like"
data-show-faces="false"
data-share="false"></span>

<a href="https://twitter.com/share"
class="twitter-share-button"
data-size="large"
data-text="TEXT"
data-url="http://www.google.com"
data-via="username"
data-related="username"
data-lang="pt"
data-show-count="false"></a>

<br>

<span class="fb-like"
data-size="small"
data-href="http://www.google.com"
data-layout="button_count"
data-action="like"
data-show-faces="false"
data-share="false"></span>

<a href="https://twitter.com/share"
class="twitter-share-button"
data-size="small"
data-text="TEXT"
data-url="http://www.google.com"
data-via="username"
data-related="username"
data-lang="pt"
data-show-count="false"></a>

<script type='text/javascript' src='//platform.twitter.com/widgets.js?ver=4.6.1'></script>
<script type='text/javascript' src='//connect.facebook.net/pt_BR/sdk.js#xfbml=1&version=v2.8'></script>

结果

Firefox（50.1.0 Linux）：

Chromium（51.0.2704.103俄语Fedora 64位）：

Answer 1

Facebook已为已登录用户推出新更新，而未登录用户。这就是你看到不同按钮的原因。虽然改变这是不可能的，但我想到的另一件事是显式更改默认值并覆盖CSS又称CSS重置。

默认值：https://developers.facebook.com/docs/plugins/share-button/

另外这个： Why jquery ui button looks different in Firefox and Chrome

Answer 2

他们在不同浏览器上的显示方式不同，如果用户未登录，则显示的方式不同（您可能已登录Chrome浏览器，＆＃ 39;为什么会这样？）

出于某种原因，Facebook现在在用户登录时使用不同的按钮样式。整个事情围绕着这个输入：

<input type="hidden" autocomplete="off" name="new_ui" value="true">

It's not a configurable feature，他们只是随心所欲地释放东西。 ：）