I assume you mean the rectangle at bottom of nav. You have set the navbar to be 100% height but you have not set the a/li items within it to perectly fill that 100%.
To get them to perfectly fill the space you would need to give nav li and nav header responsive heights like 15% I think rather than padding. But that creates other issues like needing to make the font responsive in your nav header.
A media query is the best way to get nav at top ie width:100vw; top:0px;
You will then need to also change main-doc from margin left to get it beneath the nav. Several ways to do that. I would likely use grid or flex
I mean I rather not look at the example’s code because they also write it differently than mine, I might go over some lessons again to strengthen some knowledge. But if you’re talking about the responsive web design principles the lessons are quite simple tbh.