responsive-design - 响应式 Facebook 评论 CSS Hack Broken

Question

我正在使用:

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

使 Facebook 评论在我的网站上具有响应性。就在前几天，这工作得很好，而且很花哨。今天我看看，他们已经改变了他们的代码。有没有可能让它再次工作？

Answer 1

这是一个新的纯 CSS 解决方案。为我今天(2014 年 7 月 16 日)正在开展的一个项目执行此操作，并且效果很好。

HTML

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

CSS

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

诀窍是 data-width: 100%和 min-width: 100% !important; width: 100% !important;