视频封面上的空白区域（仅限于safari，而不是chrome）

Question

我的网站视频封面有问题，但只有在Safari上打开时才会出现问题。顶部和视频之间有一个黑色空间，我无法删除。

下面有代码和图片：

  video {
  width: 100% !important;
  height: auto !important;
  min-height: 30%;
  display: table;
  background: rgb(242, 242, 242) url('images/inicio.png') center bottom no-repeat;
  background-size: 100% auto;
  margin-bottom: -4px;
  z-index: 1;

<div>
  <video autoplay loop poster="images/inicio.png"> 
    <source src="video/video.webm" type="video/webm"> 
    <source src="video/video.mp4" type="video/mp4"> 
    </video>
</div>

这是查看代码的网站： http://josefinaechenique.esy.es/videos.html

图片

Answer 1

display:table标记中的video似乎是导致那里空间巨大的问题。删除它应该解决它