How to remove the “Facebook social plugin” text?

Question

I\'m using the comments facebook social plugin When I embed it, the script created an iFrame that has the text \"Facebook social plugin\" with the facebook logo at the botto

Answer 1

Css

.facebookOuter { width:248px; padding:10px 0px 10px 10px; height:230px; overflow:hidden; } .facebookInner { height:250px; width: 238px; overflow: hidden; }

And Like Box

<div class="facebookOuter"> <div class="facebookInner"> <div class="fb-like-box" data-width="250" data-height="300" data-href="http://www.facebook.com/myhumourbook" data-border-color="dodgerblue" data-show-faces="true" data-stream="false" show_border=false data-header="false"> </div> </div> </div> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script>

Answer 2

.fb_iframe_widget {overflow: hidden;}
div.fb-comments.fb_iframe_widget span {margin-bottom: -35px;}

Answer 3

If it's a CSS issue for the iFrame then you can't do anything about it (eg: overide it). It is loading from another site so you don't have control over it.

Answer 4

I ran into this issue as well. I fixed it by setting the height of the iframe using an inline style and set overflow to hidden.

Example: iframe is 185px. Add this inline:

style="overflow:hidden; height:160px;"