Facebook Like Box width issue

We’ve indeed removed the width option from the Facebook widget, as Facebook’s new Page Plugin is built to adapt to the width of its parent container on page load, as explained here:
https://developers.facebook.com/docs/plugins/page-plugin#adaptive-width

So if you’d like to limit the size of the Page Plugin, you’ll need to set a width parameter for the parent element, as explained above.

We’re also considering adding the width parameter option back, and you can follow our progress here:
https://github.com/Automattic/jetpack/issues/2386

There must be another issue here, because the FB auto-width completely ignores the parent element’s padding. See here:

https://www.universaltheosophy.com/fblikebox.jpg

You’ll see that the parent element has a padding all the way around (11px wide). The FB like box acknowledges the padding when setting the top-left corner of the widget, but then it ignores the padding when setting the auto-width (and apparently the height as well, as the padding at the bottom is also ignored). Nothing I do with css seems to fix this.

I’m having the opposite problem. The like box is not expanding to fit the container which is set at 400px. I’ve tried the following CSS:

.fb_iframe_widget {
width: 400px;
padding-left: 14px;
}

How can I get the likebox to expand to the full container width?

Thanks!

site: https://www.shannongianotti.com

@jon @smgianotti You’ll need to add the width parameter to the parent element, not the Facebook Like Box itself.

@jon In your case, this could work:

.sidebar .widget {
	width: 300px;
}

@smgianotti

The LikeBox actually doesn’t look too bad on my end:
https://i.wpne.ws/bztI

If you want more control over the widget widget, you should be able to target .widget_facebook_likebox.