Navbar elements stacking on top of each other

For some reason the elements in my navbar are stacking on top of each other instead of beside each other, how do I solve this?

Here’s my HTML:

<nav id="nav-bar" >
    <a class="features" href="#features"> Features </a>
    <a class="how-it-works" href="#features"> How it works </a>
      </nav>
    </header>
  </body>

Here’s my CSS:

a {
  text-decoration: none;
  color: black;
  font-weight: 100;
  display: block;
  position: absolute;
  top: 50px;
  float: left;
}

If you mean the links, then you have absolute position on them and they are using the same position value, so they are on top of each other.

1 Like