Trying to center text within a video has been a challenge for me. Even after removing the header container, achieving the desired results is still possible, which works fine with me. However, I'm still struggling with getting this text centered!
<div class="video-container">
<video class="video" preload="true" autoplay = "autoplay" loop = "loop">
<source src="nyc.mp4" type="video/mp4"/>
</video>
<p class="center-block quote"> Test </p>
Styling:
.video-container {
position:absolute;
top: 0%;
left: 0%; /*centers the video */
height: 100%;
width: 100%;
overflow: hidden;
}
video {
margin-top:50px; /* gap b/w navbar and header */
position:absolute;
z-index: -1;
opacity: 0.78;
width: 100%;
margin: none;
padding: none;
}