视频 - Bootstrap模式未显示全屏按钮

Question

我们正面临这个问题。

我会尽力解释一下我们在这个项目中的工作方式。

我们有一个演示页面，另一个是我们分别将演示页面的每个元素称为模块。这是因为其他客户可以在构建“真实”页面时更轻松地工作。

一旦这样说，我们在演示页面中添加了一个视频。在我们的模块中，视频有一个“全屏”按钮，但不在我们的演示中 我们不得不说，在我们的模块中，我们从bootsrap中制作一个“假”模态，只是为了向客户展示它一旦打开就应该看起来模态。但是一旦我们将它包含在我们的演示页面中，这个按钮就不会显示出来了。我们认为这可能是因为来自bootstrap的模式阻止它显示它，但我们不确定。这里我们从模块和演示中留下一些图像。

模块：

演示：

HTML：

<div class="modal-body">
    <div class="ver-video">
        <video controls >
          <source src="video/video-finanzas.mp4" type="video/mp4">
          <source src="video/video-finanzas.ogv" type="video/ogv">
          <source src="video/video-finanzas.webm" type="video/webm">
            Tu navegador no soporta el video
        </video>
    </div>
    <div class="container-fluid wrapper-content">
        <img src="img/icn-step2-incorrecto.png">
        <h4>Text</h4>
        <h5>More text</h5>
        <p>More text</p>
        <a href="#" class="btn-onboarding" target="_top">Link</a>
    </div>
</div>

CSS：

.modal-onboarding .ver-video {
    background-image: url("../img/Step2_Resposta.png");
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 220px;
    position: relative;
}
.modal-onboarding .ver-video video{
    width: 100%;
    height: 100%;
}

正如我所说，我们不知道按钮消失的原因。也许是因为bootstrap模式阻止显示它？如果是这样，哪个是解决方案？从一个页面到另一个页面的代码是相同的，复制粘贴。