Question

我有一个div，其中有一个youtube / iframe视频，我已经使视频响应但我想控制不起作用的包装的最大高度

这是我的代码

问题目前如果我把包装器放在全宽度高度div，它的覆盖屏幕上，但我想在它上面应用最大宽度和高度

＆＃13;

.video_case {
  float: none;
  clear: both;
  width: 100%;
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 25px;
  height: 0;
  max-height: 300px;
}
.video_case iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

＆＃13;

<div class="video_case">
  <iframe src="https://www.youtube.com/embed/Rsa7a_a2H8I?rel=0" frameborder="0" allowfullscreen></iframe>
</div>

＆＃13;

Answer 1

在审核了大量相关帖子后，我发现我应该在iframe上应用max-height并修复了我的问题，所以我只是在其中定义了max-height值。

.video_case iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%
   max-height:400px;
}

包含响应iframe的包装器div的控制高度

1 个答案: