Archived topic
Video Header/Hero is Covering up Navigation
2 replies · Started by Mark on August 17, 2020
Viewing posts 1–3 of 3
Hey all, can you help me figure this out? I followed the guide to put in a video background in the header/hero and it is hiding my navigation. I want the navigation to merge with content and overlay the video with transparency. Check it out at https://www.missionstory.org/
Nevermind I got it. For those who also have this problem, it's in the CSS.
Remove overflow: hidden; from the below code.
.background-video {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 1;
}
.page-hero {
position: relative;
overflow: hidden;
}
.background-video-content {
position: relative;
z-index: 1;
}
video[poster] {
object-fit: cover;
width: 100%;
height: 100%;
}
Glad you've figured out :)
This archived topic is closed to new replies.