响应类设置 iFrame 高度为 0，导致不显示图像答案

【问题标题】：Responsive class setting iFrame height to 0, resulting in no image displayed响应类设置 iFrame 高度为 0，导致不显示图像
【发布时间】：2016-11-07 01:42:26
【问题描述】：

在处理一个项目时，我发现我在 Tumblr 上的一些图片没有显示。我发现的唯一线索是在 responsive-level-1 类中（请参阅下面的 html 代码），iFrame 的高度设置为 0。如果我在 Chrome 中弹出一个开发控制台并将其设置为，例如，1632（不是 0），图像出现。我正在使用主题（砖主题/主题花园），但能够编辑 html 和 css。我可以修改我的 css 和/或 HTML 来解决这个问题吗？该问题跨设备平台（台式机/手机/平板电脑）发生。

不显示图像的示例-http://deligrossery.com/post/149661412746/gawad-deli-grocery-207-hart-st-brooklyn-ny

对应的css文件：响应式.css：http://static.tumblr.com/eftyn9y/kc0og8vio/responsive.css 样式.css：static.tumblr.com/3zmswwt/Fmkmwgp8e/style.css （^ 在我的声誉至少达到 10 之前，我不能发布超过 2 个链接/在 style.css 中添加 https://）。

<iframe id="photoset_iframe_149661412746" class="photoset" scrolling="no" frameborder="0" height="0" width="500" style="border:0px; background-color:transparent; overflow:hidden;" src="http://deligrossery.com/post/149661412746/photoset_iframe/deligrossery/tumblr_ocn1e9dTfK1txl3g8/500/false" name="photoset_iframe_149661412746"></iframe>

【问题讨论】：

在 css 中尝试添加：.photoset { height:initial }; 你现在正在处理这个吗，因为目前对我来说，照片集帖子没有显示在 iframe 中？
嗨，谢谢-当时没有处理它-这就是问题所在，照片集根本没有显示在 iframe 中-我尝试将 .photoset { height:initial }; 添加到 style.css 但没有解决问题
嗯，它对我有用，但它没有显示在 iframe 中（尽管我检查时它是今天早些时候）。 imgur.com/a/j8JX6
谢谢-看起来确实可以显示图像，这很棒-但是图像被严重裁剪（单击缩略图以查看整个内容）。知道如何避免中断吗？
我将添加答案的开头，我不确定它是否会解决您的问题，因为我无法对其进行测试，但这应该是朝着正确方向迈出的一步。

标签： iframe tumblr responsive responsiveness tumblr-themes

【解决方案1】：

尝试将您的照片集布局块更改为类似的内容（您可能需要稍微调整一下）：

{block:Photoset}
    <div class="content photoset">
        {block:Photos}
           <img src="{PhotoURL-500}"/>
        {/block:Photos}
        {block:Caption}
           <div class="description">{Caption}</div>
        {/block:Caption}
           <p><a href="{Permalink}" class="link"></a></p>
    </div>
{/block:Photoset}

保留当前主题的备份。

这应该在普通的 html 模板（不是 iframe）中输出照片集。从那里应该更容易控制内容的高度，实际上默认情况下它应该只输出内容并且高度将自动固定。但在此之后可能还有其他问题需要调查。

【讨论】：