在 HTML 上叠加 div 5 firefox 中的视频不起作用？

Question

基本上我已经：

    .pofvv{
     position:relative;
     width:100%;
     height:100%;
     background:black;
     z-index:1;
    }
    .overlay{
     position:absolute;
     height:60px;
     width:100%;
     bottom:0px;
     background: white;
    z-index:2147483647;
    }

<video class="pofvv" id="pofvv">
  <source src="wajid.MP4" type="video/mp4">
 </video>
 <div class="overlay"></div>

如您所见，我的 overlay 容器上有最大 z-index，无论视频是否全屏，它都适用于 chrome 和歌剧。问题出在 firefox 上，如果视频进入全屏模式，我的 overlay 元素就会出现在视频下方。所以，如果有人能告诉我原因是什么以及如何解决它，我将不胜感激。

所有我的问候 ( '.* )

Answer 1

检查这个片段。

.pofvv{
     position:relative;
     width:100%;
     height:100%;
     background:black;
     z-index:1;
    }
    .overlay{
     position:absolute;
     height:60px;
     width:100%;
     bottom:0px;
     background: white;
    z-index:2147483647;
      top:50%;
    }

<video class="pofvv" id="pofvv">
  <source src="wajid.MP4" type="video/mp4">
 </video>
<div class="overlay"></div>

在 HTML 上叠加 div 5 firefox 中的视频不起作用？

Overlay a div on HTML 5 video in firefox doesn't work?

html

css

video

html5-video