Navbar to follow wherever I scroll - html

Question

I'm trying to set my navbar to be on top whenever I scroll, but when i use position: fixed; the navbar disappears. Here's my html and css respectively.
<nav>
<div class="navbar">
<button class="btn button"> Home <A href="#"> </button>
<button class="btn button"> About Me </button>
<button class="btn button"> Portfolio</button>
<button class="btn button"> Contact Me </button>
</div>
</nav>
<div class="background-img">
</div>
<div class="portfolio">
<img src="https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&cad=rja&uact=8&ved=0ahUKEwjP5v6bzfDWAhXEto8KHc_gBDoQjRwIBw&url=http%3A%2F%2Fhomequity.us%2Fdesignhouse%2Fbungalow_house_design_malaysia.html&psig=AOvVaw3hVzFHYi5ropXAhSrn1oIx&ust=1508087256948636">
</div>
The CSS
nav{
background-color: transparent;
position: fixed;
}
.btn{
background-color: Black;
color: white;
font-size: 30px;
padding: 10px;
margin: 10px 193px 10px 0px;
}
.background-img {
background: url(https://images.unsplash.com/photo-1497215842964-222b430dc094?dpr=1&auto=compress,format&fit=crop&w=2100&h=&q=80&cs=tinysrgb&crop=);
background-size: 100% 100%;
background-repeat: no-repeat;
width: 100vw;
height: 100vh;
position: relative;
}
`

Answer 1

You still need to define it's fixed position as top:0.
nav{
background-color: transparent;
position: fixed;
top:0;
width:100%;
z-index:15;
}

Answer 2

The reason is z-index value. And one more thing you probably forget to close the a tag in nav section.
nav{
background-color: transparent;
position: fixed;
z-index:99999; /* add z-index value maximum */
}
.btn{
background-color: Black;
color: white;
font-size: 30px;
padding: 10px;
margin: 10px 193px 10px 0px;
}
.background-img {
background: url(https://images.unsplash.com/photo-1497215842964-222b430dc094?dpr=1&auto=compress,format&fit=crop&w=2100&h=&q=80&cs=tinysrgb&crop=);
background-size: 100% 100%;
background-repeat: no-repeat;
width: 100vw;
height: 100vh;
position: relative;
}
<nav>
<div class="navbar">
<button class="btn button"> Home </button><!-- You need to close the a tag -->
<button class="btn button"> About Me </button>
<button class="btn button"> Portfolio</button>
<button class="btn button"> Contact Me </button>
</div>
</nav>
<div class="background-img">
</div>
<div class="portfolio">
<img src="https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&cad=rja&uact=8&ved=0ahUKEwjP5v6bzfDWAhXEto8KHc_gBDoQjRwIBw&url=http%3A%2F%2Fhomequity.us%2Fdesignhouse%2Fbungalow_house_design_malaysia.html&psig=AOvVaw3hVzFHYi5ropXAhSrn1oIx&ust=1508087256948636">
</div>