如何在动态创建的iframe中调整Facebook Like Button？

Question

我知道有很多关于“调整Facebook按钮”的问题，但他们似乎都在谈论在标记中直接使用iframe的人。我正在使用HTML5 Facebook按钮代码，然后动态加载iframe。

看一下JSFiddle

如您所见，有三个社交按钮。 Twitter和Google + 1 iframe似乎会自动调整其大小以匹配其内容。 Facebook iframe没有。它似乎是一个固定宽度的iframe，内容较窄。

是否有一种简单的方法可以正确制作这个iframe尺寸？

我可能会在页面加载后使用jQuery来操纵iframe的大小，但我想避免这种情况。如果iframe从一开始就简单地加载了正确的大小，那就太好了。

我还希望避免在我的代码中直接使用iframe，因为我会在页面后面动态加载Facebook脚本，这就是动态注入iframe的内容。

Answer 1

我不知道它是否适合自动调整，但你可以覆盖宽度。

.social{
    margin:20px 0;
    overflow: hidden;
    padding-left: 20px;

}

.social > div {
    float: left;
    height: 70px;
    margin-right: 0px;
    border: 1px solid red;
}
.facebook{
    width:45px;
}

Answer 2

我对此Facebook按钮限制的唯一解决方案是在Google+按钮后面放置“赞”按钮。这样，Facebook div的宽度到底是什么并不重要。它与其他按钮的间距相等。

http://jsfiddle.net/FLuKW/10/