如何在没有 JS 的情况下使 instagram iframe 具有响应性？

Question

我正在尝试使用 instagram 帖子制作一个响应式网格，而 padding-bottom hack 在我的情况下不起作用。我做了一个简单的jQuery脚本，我发现height = width + 306px。

我是怎么做到的：

let $instagramPosts = $('.instagram-post'),
    width = $instagramPosts.eq(0).width(),
    differenceWH = 306;

$instagramPosts.height(width + differenceWH);

有没有可能不用JS只用CSS？

Answer 1

您可能想查看 css calc()，因为我不知道您的初始高度，我假设它是 x。所以对于计算，你可以这样做

.instagram-post {
    height:calc(x + 306px);
}