Facebook LikeBox minimum width got too large

Question

I noticed the Facebook LikeBox (facebook social plugins) I integrated in many sites is now awfully overlapping beyond its designed width.

When I tried to re-generate the code, I noticed the minimum supported width on the official Facebook widget page is now "292 pixels", which is far beyond the space of an average sidebar in most of the sites I manage.

Hope the problem is just mine, but wound't be better to allow the Likebox to be resized in smaller sizes (min 180 pixels, say)? Not all sites can afford a sidebar of 300 pixels!

I used a workaround that cuts (hides) the oversized part on the right by cutting it, inside a DIV, but clearly this is far from optimal.

raam86 · Answer 1 · 2013-06-12T13:57:04.437

5

You leave a lot for guess work So I guess you are using the HTML5 method.

Try using the iframe method by selecting the tab after clickin get code on the dev page.

FBLB

You will then have to change the width property to whatever you wish

edited Jun 12 '13 at 13:57

answered Jun 12 '13 at 13:51

raam86

6,785
2
31
46

iframe method worked for me. it's great when they break your website like this, very responsible to end users... – Marko D Jun 13 '13 at 12:28

score 0 · Answer 2 · answered Jun 12 '13 at 14:30

You can reset the minimum width in the like box plug-in code generator. You can either set it directly in the width option (it will take any number even though it suggests 292) or you can manually change it in the actual code generated (appears in two places as in the example previously posted).

score 0 · Answer 3 · answered Jun 13 '13 at 04:00

if i am not wrong, there seems to be a secert update to Facebook Like Box last night. Facebook Like Box no longer seems to support width lesser than 292px.

To verify, go to https://developers.facebook.com/docs/reference/plugins/like-box/. Key in width lesser than 292px, it will no longer go lesser than 292 width.

camping for more verification

score 0 · Answer 4 · answered Jun 13 '13 at 06:38

0

I have the same problem, but unfortunately am not able to try the fix out right now.

An idea would be to wrap the Like Box in a div, then use CSS to set #myDiv iframe { width: 230px !important; }. Let me know if one of you gets this to work.

answered Jun 13 '13 at 06:38

Niko Nyman

1,916
2
16
26

Imho, iframe loaded after rendering all the html and css, so you can't change styles from css, no? – uladzimir Jul 12 '13 at 07:32

score 0 · Answer 5 · edited May 23 '17 at 11:56

0

As per niutech's answer here, you can override the width like this:

.fb-like-box span, .fb-like-box iframe {
    width: 180px !important;
}

edited May 23 '17 at 11:56

Community

1
1

answered Jan 19 '14 at 03:19

danwild

1,886
1
26
31

Facebook LikeBox minimum width got too large

5 Answers5