image - Facebook 喜欢的盒子图像失真

Question

我在我的网站上使用 FB like box 小部件。我注意到在 FB 上发布的较大图像在框中出现扭曲。

我看到负责这个的css是：

.uiScaledImageContainer img {
    height: 100%;
    min-height: 100%;
 }

有没有办法强制height: auto我的CSS？显然，我在样式表中为此元素声明的任何内容都会被忽略，即使使用!important.

Answer 1

因为到目前为止没有任何改变，这里有一些我发现这个问题的更多细节：

• 它只出现在相册中的图像上，而不是在帖子中上传的单个图像上。
• 在我看来，它出现在 chrome 浏览器和 iphone 和 android 设备上，而不是在 Firefox 和 Internet Explorer 上。

也许这有帮助。

Answer 2

您无法在 Facebook 的 iFrame 中编辑 CSS。我遇到了同样的问题，但是还有一段代码用“height:auto”覆盖了“height:100%”，我得到了相同的结果。如果我将最小高度更改为“自动”，它似乎可以修复它。

原始代码是：

.fan_box .uiStreamStory .uiStreamAttachments .photoRedesignAspect .img, .fan_box .uiStreamStory .uiStreamAttachments .photoRedesignCover .img, .fan_box .photoRedesign .img, .uiStreamStory .videoRedesign .uiVideoThumb img {
height: auto;
left: 0 !important;
width: 100%;

和

.uiScaledImageContainer img {
height: 100%; <!-- this is being overwritten -->
min-height: 100%;
position: relative;

现在我们只需要有人更新 facebook 的 likebox.php。令人惊讶的是，IE 是唯一没有问题的浏览器。由于某种原因，Firefox 没有完全加载应用程序......