Navbar isn't positioned at the very top of the web

Try adding fixed-top class to the first line of your navbar code, like this:

<nav class="navbar navbar-expand-md bg-light navbar-light fixed-top">

Looks like collapsing margins to me.

Without seeing the code, it's impossible to say, however, collapsing margins between a parent and child element would cause exactly what you're seeing.

This page explains what it is and how to fix it better than I could here: https://www.sitepoint.com/collapsing-margins/ 

Anwers to layout questions are contained in your CODE not screenshots.

Your local computer is not a publicly accessible website.

Upload your site to a public server that you control. Post the URL here so we can see your online site.   If you don't have web hosting yet, get some.

What does it look like in your browser? The same as what you are seeing?  Are you able to share a link to the page so we can examine the code?  If not, most we can say is that something happened to your code and best thing to do would be to compare against the bootstrap sticky header navbar if that is what you are going for: https://getbootstrap.com/docs/5.2/examples/navbar-fixed/