垂直对齐html5全屏视频和自定义控件

Question

我正在寻找一个漂亮的主题html5视频播放器，在jwplayer旁边，我在Github找到了Videre项目https://github.com/Hipady/Videre

我分叉代码并删除了一些我不需要的东西。但我还没有能够全屏使用我的自定义视频控件。

这是一个测试页：https://onny.project-insanity.org/files/videre-html5-videoplayer-test/index.html 这是源代码：https://git.project-insanity.org/onny/web-videre-diet

这是显示问题的屏幕截图：

不幸的是，我无法弄清楚如何在全屏中垂直居中视频：（

问题可能与CSS的这一部分有关：

.vid-wrapper {
  position: relative; }
[...]
  .vid-wrapper .vid-html5 {
    position: relative;
    z-index: 1; }
    .vid-wrapper .vid-html5 video {
      display: block;
      background-color: black; }

在这种情况下，Firefox和Chrome的行为似乎有所不同，似乎只有Firefox才有这个问题。

祝你好运， 纳斯