css - 除非我在 iframe 中设置高度，否则宽度不会 100%

Question

我在 WordPress 网站上使用 iframe 来显示 html5 动画，但除非我设置 iframe 的高度，否则它会减小宽度。

谁能帮我解决这个问题？我已经尝试了很多方法来修复它，但没有滚动出现，所以我可以获得 100% 的宽度，它只是减小了宽度。

https://tempart.posabilities.co.uk/our-story/

我认为我的动画代码存在冲突：

<div id="animation_container" style="background-color:rgba(255, 255, 255, 1.00); width:960px; height:1615px">
    <canvas id="canvas" width="960" height="1615" style="position: absolute; display: none; background-color:rgba(255, 255, 255, 1.00);"></canvas>
    <div id="dom_overlay_container" style="pointer-events:none; overflow:hidden; width:960px; height:1615px; position: absolute; left: 0px; top: 0px; display: none;">
    </div>
</div>
<div id='_preload_div_' style='position:absolute; top:0; display: inline-block;  width: 960px; text-align: center;'>    <span style='display: inline-block; height: 100%; vertical-align: middle;'></span>  <img src=images/_preloader.gif style='vertical-align: middle; max-height: 100%'/></div>

我也试图让动画在滚动上进行，但完全迷失了！

标签： csswordpresshtmliframehtml5-canvas

Answer 1

这是你的;

    #artkiframeHolder {
    height: 1000px;
    width: 100%;
    position: relative;
    overflow: scroll;
}

让它像这样

#artkiframeHolder {
    height: 1000px;
    width: 100%;
    position: relative;
    overflow: hidden;
}