I'd like to isolate a Facebook profile pic in their comment widget by resizing and offsetting the generated iframe. The tricky part (or so it seems to me) is that the generated iframe includes inline styles.

Anyone care to help?

I'm sure this is against TOS, but it's just for a proof of concept.

Here is the doc:
<http://developers.facebook.com/docs/reference/plugins/comments/>

Here is the recommended code:

```
<div id="fb-root"></div>
<script>(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_US/all.js#xfbml=1&appId=145044622175352";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-comments" data-href="http://stackoverflow.com" data-num-posts="1" data-width="200"></div>

```

And here is the generated source:

```
<div class=" fb_reset" id="fb-root"><div style="position: absolute; top: -2000px;"><iframe src="http://static.ak.facebook.com/connect/xd_arbiter.php?version=4#channel=f218f99fdee7694&amp;origin=http%3A%2F%2Fstackoverflow.com&amp;channel_path=%2Fquestions%3Ffb_xd_fragment%23%3F%3D%26xd_sig%3Df978c5a2550e88%26&amp;transport=postmessage" name="fb_xdm_frame_http" id="fb_xdm_frame_http"></iframe><iframe src="https://s-static.ak.facebook.com/connect/xd_arbiter.php?version=4#channel=f218f99fdee7694&amp;origin=http%3A%2F%2Fstackoveflow.com&amp;channel_path=%2Fquestions%3Ffb_xd_fragment%23%3F%3D%26xd_sig%3Df978c5a2550e88%26&amp;transport=postmessage" name="fb_xdm_frame_https" id="fb_xdm_frame_https"></iframe></div><div style="position: absolute; top: -10000px; height: 0pt; width: 0pt;"><div><iframe src="http://www.facebook.com/dialog/oauth?api_key=145044622175352&amp;app_id=145044622175352&amp;channel_url=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter.php%3Fversion%3D4%23cb%3Df75bfba58018fa%26origin%3Dhttp%253A%252F%252Fstackoverflow.com%252Ff218f99fdee7694%26domain%3Dstackoverflow.com%26relation%3Dparent.parent&amp;client_id=145044622175352&amp;display=none&amp;domain=stackoverflow.com&amp;locale=en_US&amp;origin=1&amp;redirect_uri=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter.php%3Fversion%3D4%23cb%3Dfc987f035fe9c2%26origin%3Dhttp%253A%252F%252Fkidnog.dev%252Ff218f99fdee7694%26domain%3Dkidnog.dev%26relation%3Dparent%26frame%3Df209b5ae6806ada&amp;response_type=token%2Csigned_request%2Ccode&amp;sdk=joey" class="FB_UI_Hidden" style="border: medium none; overflow: hidden; height: 240px; width: 575px;" name="f2ee3a0e40436fc" id="f209b5ae6806ada" scrolling="no"></iframe></div></div></div>
<script>(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_US/all.js#xfbml=1&appId=145044622175352";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-comments  fb_iframe_widget" data-href="http://stackoverflow.com" data-num-posts="1" data-width="200"><span><iframe src="https://www.facebook.com/plugins/comments.php?api_key=145044622175352&amp;channel_url=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter.php%3Fversion%3D4%23cb%3Dfee6478d70ba1%26origin%3Dhttp%253A%252F%252Fkidnog.dev%252Ff218f99fdee7694%26domain%3Dstackoverflow.com%26relation%3Dparent.parent&amp;href=http%3A%2F%2Fstackoverflow.com&amp;locale=en_US&amp;numposts=1&amp;sdk=joey&amp;width=200" class="fb_ltr" style="border: medium none; overflow: hidden; height: 213px; width: 200px;" name="f313c20e013258c" id="f6f0fea91f7fa" scrolling="no"></iframe></span></div>

```

Ideal output is something like:

![pic](https://i.stack.imgur.com/mocUq.jpg)

Instead of something like this:

![comment](https://i.stack.imgur.com/4mLLS.jpg)