Bootstrap CSS Classes

« All Bootstrap CSS classes

Bootstrap CSS class .nav-fill

<ul class="nav nav-pills nav-fill">
  <li class="nav-item">
    <a class="nav-link active" href="#">Active</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Longer nav link</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Link</a>
  </li>
</ul>

Preview

CSS source

/* _nav.scss:91 */
.nav-fill {
  .nav-item {
    flex: 1 1 auto;
    text-align: center;
  }
}

Are you tired of writing HTML by hand?

More Bootstrap CSS classes in Navs category

.ul.nav
.nav justify-content-*
.nav.nav
.nav-tabs
.nav-pills
.nav-justified
.nav-tabs with dropdown
.nav flex-column
.nav-fill
.nav-pills with dropdown
.nav with flex utils
.tab-content
.tab-pane
Shuffle Editor

Build websites faster with an AI Visual Editor

Shuffle Editor on Twitter Shuffle Editor on YouTube Shuffle Editor on Facebook new Join our Discord server

Products

UI Components

Extensions

Support

Company

© 2025 Shuffle. All rights reserved.