Vertical Navigation

.flex-column → Stacks nav items vertically

Example: Vertical Nav

HTML
<ul class="nav flex-column">
  <li class="nav-item">
    <a class="nav-link active" href="#">Dashboard</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Profile</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Settings</a>
  </li>
</ul>

Explanation:

  • .flex-column converts navigation into vertical layout.

Output:

PreviousNext