Fluid & Responsive Facebook Like Box

Question

我使用的是“旧的”FB Likebox：

<div class="container">
    <div class="row-fluid">
        <div class="span12">
            <div id="fb-root"></div>
            <script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
            <script type="text/javascript">FB.init("394109690683544");</script>
            <fb:fan height="120px;" width="100%" logobar="false" stream="false" connections="12" css="http://myurl.com/facebook.css" profile_id="562615520421911" class="fb_iframe_widget "></fb:fan>
        </div>
    </div>
</div>

如何才能将css更改为始终具有100%宽度？我需要使用带有twitter bootstrap和responisve的盒子。

谢谢

Answer 1

如果您查看生成的代码，它将不会工作

<fb:fan height="120px;" width="200%" ...

翻译为

<iframe id="f13ed26db2962a6" class="fb_ltr" scrolling="no" name="f2625075f1fd254" style="border: medium none; overflow: hidden; height: 120px; width: 200px;"

这意味着当iframe设置为200px而不是200%时，小部件只读取值

编辑:似乎我可以用jQuery来实现，但是因为我不能将span设置为100%，即使它是display:block，我使用文档宽度将跨度设置为适当的宽度，但是您可能需要将其更改为父div的宽度。又是老生常谈，但可能会让你开始...

JSFiddle