Vimeo球员iframe身高

Question

我的网站主页上有一个Vimeo播放器iframe。我的目的是在浏览器窗口中以全宽 - 边缘到边缘 - 使用它;同时保持纵横比并避免黑条。所以视频填充的区域最多。

我将此css应用于vimeo播放器：

.fluidVideoWrapper {
  padding: 0;
  width: 100%;
  height: 20em;
  position: relative;
}

.fluidVideoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

20em只是让你们可以在页面上看到它。当我将高度设置为100%时，它会消失，高度似乎变为0。

我可以在这里看到我尝试尝试的一个例子，向下滚动到vimeo播放器：vsco.co

有人可以建议修复此问题吗？

Answer 1

尝试制作.fluidVideoWrapper容器position: absolute;并使其宽度和高度达到100％