Question

I want to remove the facebook likebox scroll bar and am having issues as it seems they load the styles for the likebox as investigation indicates styles loaded after page loads.

I have identified ‘pluginLikeboxStream’ as the class that i want to overwrite or add ‘overflow: hidden’ too too but don’t know how to add to or overwrite the default style from facebook.

I’ve tried local css file, and jquery without success.

Any ideas

    (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_GB/all.js#xfbml=1&appId=445282282200701";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));'

html:

<div class="fb-like-box" data-href="https://www.facebook.com/mypage" data-width="355" data-height="400" data-show-faces="false"
                data-stream="true" data-border-color="#FFFFFF" data-header="false">
            </div>

Answer 1

The Facebook likebox is loaded as an IFrame within the div you declare.

You don’t have any control over the styling of an IFrame from another source.

Facebook give you some control over how the like box is displayed but you can’t do anything beyond that.