Bootstrap Navbar Active Disabled

Code Feedback
1

Hello,
Could someone explain what the active and disabled refer to in this example from Bootstrap’s official docs? I thought it would refer to the state of the link as in active link vs. disabled link. However, when I add links to test, all links appear that they work.

<ul class="nav">
  <li class="nav-item">
    <a class="nav-link active" href="#">Active</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Link</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Link</a>
  </li>
  <li class="nav-item">
    <a class="nav-link disabled" href="#">Disabled</a>
  </li>
</ul>
2

active and disabled are classes that only change the styling, not the functionality. active will look like this is the link to page you are on already. disabled makes it looks like the link won’t work.

EDIT: You should add active and disabled to the li tag and not the a tag. Also add nav-tabs or nav-pills class to your ul tag (for active to have any effect).

3

Thanks so much for clearing this up!