Just getting started with HTML/CSS and designing a website with buttons. Got some buttons up and running perfectly fine. But now, I'm working on a navigation bar with anchors inside. The problem is that while I can see the anchors when I open the website, I just can't click on them. Strangely, all my other buttons are working without any issues. Could it possibly be related to the nav id?
.menubalk{
padding:25px;
}
.menubalk ul{
list-style:none;
display:inline;
margin-left:0;
padding:375px;
}
.menubalk li{
display:inline;
}
.menubalk a{
color:black;
background-color:#0072BB;
text-transform:uppercase;
font-size: 12px;
font-weight:bold;
padding: 20px;
border-radius:5px;
}
.content{
background-color:#0072BB;
border-radius:25px 25px 25px 25px;
margin-left:175px;
padding:25px;
}
p,h2,img{
margin:0;
}
nav{
background-color:#0072BB;
float:left;
width:150px;
border:10px solid white;
border-radius:25px 25px 25px 25px;
}
#wrapper{
margin:0px auto 0px auto;
min-width:500px;
max-width:1800px;
}<div id="wrapper">
<header>
<div class="logo">
<img src="../Afbeeldingen/QualitySigns.png" alt="logo Quality Signs" height="300" width="384">
<div class="logotekst">
<p>
Signalisatie van hoge kwaliteit
</p>
</div>
</div><!--einde logo-->
<div class="menubalk"><!-- begin menubalk-->
<ul>
<li><a href="#">Projectpagina</a></li>
<li><a href="#">CV-pagina</a></li>
<li><a href="#">Extra link</a></li>
</ul>
</div><!-- einde menubalk-->
</header>
<nav>
<ul>
<li><a href="index.html">Over ons</a></li>
<li><a href="#">Productie</a></li>
<li><a href="#">Verhuur</a></li>
<li><a href="#">Plaatsing</a></li>
</ul>
</nav>
Would really appreciate if someone could help me figure out this problem. Thank you!