Facebook Like Button not displaying in Firefox

问题

I am trying to figure out why my Facebook like button isn't displaying on a limited (number of?) page on my site with Firefox. In other parts of the site, I have gotten the FB like button to display but in this particular instance, I have not. Any ideas?

http://www.jdsupra.com/post/documentViewerEmbed.aspx?fid=dcba78a0-9b30-448d-97be-bb572b64ebe4&height=500&width=748&contentOnly=1

回答1:

Some of the elements nested deeper in that FB share element have a width and height of 0, so they are not visible even though they are showing up in the DOM if you inspect with Firebug. I solved this by giving a width and height to the first span element and the iframe element via CSS.

.fb_iframe_widget iframe {
    height: 100px;
    position: absolute;
    width: 100px;
}

.fb_iframe_widget span {
    display: inline-block;
    position: relative;
    text-align: justify;
    vertical-align: text-bottom;
    width: 100px;
    height: 100px;
}

Those are the elements but you'll have to change the width and height to what you want.

回答2:

I guess you used the like button generator?

https://developers.facebook.com/docs/reference/plugins/like/

Also, always check the link you want to like in the debugger:

https://developers.facebook.com/tools/debug/

Looks fine to me btw, and the button is visible and working even in Firefox. But only on this link: http://www.jdsupra.com/legalnews/group-claims-that-milwaukee-police-misco-28882/

Your original link is missing the whole social buttons bar, because it is hidden with "display:none".

...but it still does not load the like button correctly, my guess is that you got this problem: Facebook Like buttons not displaying when loaded hidden

来源：https://stackoverflow.com/questions/13537681/facebook-like-button-not-displaying-in-firefox