Facebook 嵌入代码中奇怪的 iframe 宽度错误

Question

我正在尝试在我的网站上嵌入 Facebook 评论，但是盒子的宽度看起来不对。 width: 286px, 加载默认350px;

有趣的是，当我打开 Developer Console 并重新加载页面时，iframe 以其应有的确切大小完美加载。

我也尝试编写 jquery 脚本在页面呈现后重新加载 iframe 但没有成功。

有谁知道为什么会这样，我该如何解决？谢谢

                            <div class="container">
                              <div class="row">
                                <div class="col-sm">
                                    <div class="card" style="width: 286px; height:215px;">
                                          <iframe onload="reloadOnce(this)" width="286px" height="215px" src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Fkirsty.armstrong.904%2Fposts%2F2292031390876127&width=286" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe>
                                    </div>
                                </div>
                                <div class="col-sm">
                                    <div class="card" style="width: 286px; height:215px;">
                                          <iframe onload="reloadOnce(this)" src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Faneesa.aidroos.3%2Fposts%2F386560588794579&width=286" width="286px" height="215px" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe>
                                    </div>
                                </div>
                                <div class="col-sm">
                                    <div class="card" style="width: 286px; height:215px;">
                                          <iframe onload="reloadOnce(this)" src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Falinbush%2Fposts%2F2343483609028644&width=286" width="286px" height="215px" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe>
                                    </div>

                                </div>
                              </div>
                            </div>

Answer 1

Facebook 要求最小宽度为 350 像素。

Facebook 嵌入代码中奇怪的 iframe 宽度错误

Weird iframe width bug on facebook embed code

html

css

iframe

jquery

facebook-iframe