响应的Facebook评论框

Question

我一直在研究几种不同的方法来强制 facebook评论框插件流畅/响应/液体/无论我们呼叫它< em>（只显示名字的愚蠢），所有这些都运行良好。但是，当从 Google Chrome 访问时，所有这些插件都会使插件消失。

我正在使用它：

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

具有相同的结果（显然）：

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

问题：我该如何解决这种奇怪的行为？ （为什么会发生？）

感谢您的时间。无论你有没有帮助我，今天过得愉快！ ：）

Answer 1

这对我有用：添加到fb-comments div data-width =＆＃34; 100％＆＃34;

<div class="fb-comments" data-href="http://example.com/comments" data-width="100%" data-numposts="5" data-colorscheme="light"></div>

当您调整浏览器大小时它会响应。

你可以将fb-comments div放在另一个div中，然后给那个div你想要的宽度。

Answer 2

这是facebook评论部分 -

<div class="fb-comments" data-href="http://example.com/comments" data-numposts="5" data-colorscheme="light"></div>

只需将此CSS添加到div -

即可

<style>.fb_iframe_widget span[style]{width:100% !important;}</style>

Answer 3

只需在div

中插入data-width =“100％”

<div class="fb-comments"  data-width="100%"></div>

Answer 4

您可以使用data-mobile atribute

<div class="fb-comments" data-href="http://example.com/comments" data-numposts="5" data-mobile="true"></div>