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

Question

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

我试图使用这两个小部件的“大”版本。 Chromium可以显示大小版本的Twitter小部件，而不会出现任何问题，而出现一个完全不同的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> 

结果

火狐（50.1.0 Linux的）：

铬（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浏览器中，这就是发生这种情况的原因）。

由于某些原因，当用户登录时，Facebook的按钮现在使用了不同的样式。整个事情是解决此输入：

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

It's not a configurable feature，因为他们去，他们刚刚发布的东西。 :)