Facebook Like Button Not Showing Up In Firefox

Question

I'm using the following code for my like button

<fb:like id="facebook-like" href="http://mysite.com/index.php" layout="button_count" width="450" show_faces="false" font=""></fb:like>

Some users have experienced the like button not showing up. Noted in 3.6.17 but observed in other versions. I'm somewhat familier with the firefox iframe bug, but I was currious if anyone has any work arounds for the facebook like button.

Answer 1

Like buttons that are rendered with javascript (<div class="fb-like"/> and <fb:like/>) get height=0 if they are initially hidden (display:none).

To work around this, create the element with javascript after the container is displayed, and then run:

FB.XFBML.parse();

Example:

result.show();
var like_box = $(".fb-like-inactive", result);
like_box.removeClass("fb-like-inactive");
like_box.addClass("fb-like");
FB.XFBML.parse();

Answer 2

This CSS solved it for me

.fb-like span, .fb-like iframe { height:25px!important; width:150px!important}