I used 100vh for the 3 main components on my project. My issue is that I don’t want my nav to be transparent, but to have a opaque white color. I tried changing the color of the header but that didn’t work.
How do I proceed ?
Why do you need a 100vh on your nav? You would not be able to click on anything on the actual page.
You should add height(like 120px or about so) on your nav and background-color as well. And you should be fine.
Your .nav class was extending down to the bottom of the page. I believe its because of the 100vh like @vasylk said. Setting it to 80px puts it in line evenly with the rest of the .nav stuff. But that also leaves anything that is going to be in the header subject to cover the whole page. Just keep that in mind, 100vh is 100% of the screens real estate.
To make the navbar an opaque white color I just used rgba(255,255,255,0.8)