Facebook评论令人难以置信的萎缩答案

【问题标题】：Incredible shrinking Facebook commentsFacebook评论令人难以置信的萎缩
【发布时间】：2013-11-27 01:30:35
【问题描述】：

这个很奇怪。我的一个页面上有 HTML5 Facebook cmets，页面加载后，Facebook 评论区域开始水平缩小，直到达到 5 或 0px。你可以在这里看到它：

我无法弄清楚为什么会发生这种情况。它不是这样开始的，它最近才开始这样做。

我已尝试禁用所有其他 JS，但它仍在发生。我搜索了谷歌和 StackOverflow。似乎没有其他人遇到过这种情况。

有什么想法吗？我是否遗漏了一些非常明显的东西？

【问题讨论】：

【解决方案1】：

将fb-comments fb_iframe_widget容器内的span宽度设置为100% !important。

像这样：

.fb_iframe_widget span { width: 100% !important}

编辑：

原因似乎在于 Facebook 的脚本之一，该脚本计算元素相对于父元素的宽度。剧本中的一段：

s.height=Math.max(this._shrinker.offsetTop,0)

这意味着，除非父元素（在您的情况下，具有 fb-cmets 和 fb_iframe_widget 类的 div）具有固定宽度，否则脚本将循环并继续减小宽度。

如果您有兴趣，这里是脚本中的 sn-p：http://pastebin.com/GesPgQNY

【讨论】：

【解决方案2】：

为元素设置min-width 将解决问题。并且最好为插件的父元素分配一个唯一的类，以避免将来发生冲突。

.fb-comments.fb_iframe_widget span:first-child {
min-width: 600px;
}

【讨论】：

【解决方案3】：

这是因为我添加了一些自定义 CSS 来调整 FB cmets div 的宽度。

.fb-cmets, .fb-cmets iframe[style] {width: 90% !important;

一旦我删除它，它就可以正常工作。好奇怪。

感谢您的帮助！

【讨论】：