Is it possible to set a fluid width for Facebook's social plugins?

Question

I'm developing a site around the "responsive design" concept, but the facebook social plugins are static width and "break" the layout when it's re-sized.

Using media queries, I've set the plugins to hide on low-res browsers (mobile, etc...). However, on desktop browsers, when the browser window is re-sized smaller, but not so small to hide the plugins, they break out of the layout.

Any way to set a fluid width for the Facebook social plugins?

Answer 1

none of these methods worked but using this idea, the following worked for me:

.fb-comments, .fb-comments span, .fb-comments.fb_iframe_widget span iframe {     width: 100% !important; } 

Answer 2

I found a solution using css. Inspiration came from this article http://css-tricks.com/2708-override-inline-styles-with-css/

.fb-comments, .fb-comments iframe[style] {width: 100% !important;}