Facebook登录（连接）按钮在Chrome中的渲染失败

Question

今天我意识到，在Chrome浏览器中FB登录按钮不再正确渲染（可能是因为浏览器更新 - 谁知道呢）。 在IE和Chrome中查看此http://goo.gl/mK6sf网站。每个按钮在Chrome中都有一些额外的“padding-top”，并且iframe没有正确隐藏。 这是png预览http://goo.gl/sfUl5 编辑： 如何使FB登录按钮像IE一样正确呈现？您是否在其他网站上遇到类似问题？Facebook是否更改了某些内容，还是Chrome有问题？

编辑2 2013-01-16： 请参阅此线程：https://developers.facebook.com/bugs/592452207446912。这可能是Facebook API错误。他们修复后我会发布响应。

- Wojciech Jasiński

---

45秒后出现以下错误：fb:login_button在45秒内无法调整大小。 - Wojciech Jasiński

我曾经也遇到过同样的问题。我在这里回答了相关的问题。 - Saad Anees

Answer 1

感谢来自Facebook开发者论坛的Matt Bower，临时解决方案如下：

#fb_login_button { 
    width: 80px; 
}
#fb_login_button span, 
#fb_login_button iframe {.
    width: 80px! important;
    height: 25px! important;
}

我仍在等待Facebook开发人员解决这个问题。

- Wojciech Jasiński

Answer 2

您不能在 iframe 中使用登录插件。请使用 JavaScript SDK 和 XFBML 或 HTML5 实现。 尝试使用以下代码：

<fb:login-button show-faces="false" width="200" max-rows="1"></fb:login-button>

- QArea

---

我使用的代码是：<fb:login-button class="fb-login-button" size="small" show-faces="false" width="200" max-rows="1" scope="{{ scope }}" autologoutlink="{{ autologoutlink }}">{{ label }}</fb:login-button> 查看网页源代码，你会发现当你展开 fb:login 节点时，里面有一个 iframe。 - Wojciech Jasiński