我目前正在做我的考试项目,并且正在建立一个wordpress主题(已将其转换为CodePen的HTML)。

它正在运行,但可悲的是,我用于播客的所有iframe都卡在设定的高度,而不是像我想要的那样填充。我做了很多尝试来解决此问题,但无法使其正常工作。

可在以下位置获得代码笔
https://codepen.io/Puffss/pen/weWPmW

而主要是关于



iframe {
  background: url(img/placeholdersoundcloud.jpg);
  background-size: cover;
  width: 18%;
  height: 50%;
  float: left;
  margin: 0% 1% 0.6% 1%;
}

<iframe width="640" height="400" scrolling="no" frameborder="no" src="./SpaarnestadPhoto Exposities_files/saved_resource.html"></iframe>





请注意:这是在单个网页上生成的wordpress代码,因此是iframe中奇怪的代码和缺少的链接。

最佳答案

将此添加到您的CSS

iframe{
  height:50% !important;
  width: 600px;
}


对于所有标签<iframe>,它将用所需高度(在本例中为50%)覆盖内联高度。

我还建议您检查WordPress为什么自动设置高度和宽度,并可能尝试从源代码中删除它们,因为通常使用重要的方法不是最佳实践https://codepen.io/NickHG/pen/BZzJKZ

关于html - iframe高度未填充到50%,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/44515869/

10-12 12:30
查看更多