1

http://developers.facebook.com/docs/reference/plugins/comments/

它在那里说:

当检测到移动设备用户代理时,移动版本将自动显示。您可以通过将 mobile 参数设置为 false 来关闭此行为。请注意:移动版忽略了宽度参数,取而代之的是 100% 的流动宽度,以便在纵向/横向切换情况下很好地调整大小。您可能需要为您的移动网站调整 CSS 以利用此行为。如果愿意,您仍然可以通过容器元素控制宽度。

但是当我在iphone上访问我的页面时,虽然我看到了Facebook评论的“移动设计”,但框的宽度是我在代码上设置的。

我的测试页面: http: //www.santiagosarceda.com/facebook/

这是我的代码:

<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
</head>
<body>
<div class="fb-comments" data-href="http://www.site.com/3953172" data-num-posts="5" data-width="300"></div>
</body>
</html>

该框总是以 300px 宽度呈现。

Facebook 评论本身有问题吗?因为几天前一切正常。

谢谢阅读!

4

1 回答 1

11

Facebook 评论生成已更改的内联样式,并且以下 CSS 似乎覆盖了内联 SPAN CSS,以使 Facebook 评论流体宽度

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

我希望这对你有用。

于 2012-06-04T12:26:38.710 回答