Is it possible to make Facebook's comments widget a fluid width? Their documentation shows a width field for the fb:comments
xfbml or iframe which is specified as:
- width - the width of the plugin in pixels. Minimum recommended width: 400px.
So maybe it's not possible...
Alan your solution was working however it looks like facebook updated their plugin and broke the style. I got it working again using the universal selector:
Probably next change from FB and this time this works better:
After grappling with this for quite some time I found a tidbit that should help you to figure out which of the CSS tricks on this page will help for your particular site/version/year of facebook's comment plugin. Look at your site in a browser and inspect the elements around the facebook comment plugin. You should find a snippet that you added and is now embellished by facebook's javascript widget that looks something like this:
take note of the part that says:
this is the class you want to use - so in my example above, you would want to add the following styles:
insert this code before initialize facebook plugin and you will have fluid fb comments :):):)
I can't comment yet because my reputations not yet high enough, however there is a solution to this as of Dec 21, 2014
for this to work in CSS:
you MUST have the data-width="" section set to 100% within the FB plugin code i.e
working example with fluid motion: http:www.unitedbiker.org
Hope this helps everyone out, the idea is to override the iframe style to be 100% of the parent element, and to set the actual FB plugin to 100% of the iframe. This was my work around.
I think this will work for everyone. Works for me Dec 26, 2013 at http://eddie11.com/dj-eddie-talks/
None of the below worked for me but I left it there anyway.