Question: Facebook button renders differently on Firefox vs Chrome

Question

Facebook button renders differently on Firefox vs Chrome

Answers 0
Added at 2016-12-29 19:12
Tags
Question

I'm having inconsistent results when using social media "widgets", more specifically the Facebook Like button. It is shown differently on different browsers.

I'm trying to use the "large" version of both widgets. Whereas Chromium can display the large and small versions of the twitter widget without any issues, a quite different facebook button shows up.

At a first glance, it doesn't seem to be a rendering issue, as apparently facebook is using different source assets for the widget -- notice the white "f" and the baloon counter.

What's causing this and how can I solve it?

Code

<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>

Result

Firefox (50.1.0 Linux):

enter image description here

Chromium (51.0.2704.103 Russian Fedora 64-bit):

enter image description here

Answers
Source Show
◀ Wstecz