summaryrefslogtreecommitdiffstats
path: root/site/content/docs/5.3/components/navs-tabs.md
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--site/content/docs/5.3/components/navs-tabs.md (renamed from site/content/docs/5.2/components/navs-tabs.md)31
1 files changed, 29 insertions, 2 deletions
diff --git a/site/content/docs/5.2/components/navs-tabs.md b/site/content/docs/5.3/components/navs-tabs.md
index 1748dd1..3242506 100644
--- a/site/content/docs/5.2/components/navs-tabs.md
+++ b/site/content/docs/5.3/components/navs-tabs.md
@@ -3,7 +3,7 @@ layout: docs
title: Navs and tabs
description: Documentation and examples for how to use Bootstrap's included navigation components.
group: components
-aliases: "/docs/5.2/components/navs/"
+aliases: "/docs/5.3/components/navs/"
toc: true
---
@@ -167,6 +167,27 @@ Take that same HTML, but use `.nav-pills` instead:
</ul>
{{< /example >}}
+### Underline
+
+Take that same HTML, but use `.nav-underline` instead:
+
+{{< example >}}
+<ul class="nav nav-underline">
+ <li class="nav-item">
+ <a class="nav-link active" aria-current="page" 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">Disabled</a>
+ </li>
+</ul>
+{{< /example >}}
+
### Fill and justify
Force your `.nav`'s contents to extend the full available width one of two modifier classes. To proportionately fill all available space with your `.nav-item`s, use `.nav-fill`. Notice that all horizontal space is occupied, but not every nav item has the same width.
@@ -324,6 +345,12 @@ On the `.nav-pills` modifier class:
{{< scss-docs name="nav-pills-css-vars" file="scss/_nav.scss" >}}
+{{< added-in "5.3.0" >}}
+
+On the `.nav-underline` modifier class:
+
+{{< scss-docs name="nav-underline-css-vars" file="scss/_nav.scss" >}}
+
### Sass variables
{{< scss-docs name="nav-variables" file="scss/_variables.scss" >}}
@@ -622,7 +649,7 @@ To make tabs fade in, add `.fade` to each `.tab-pane`. The first tab pane must a
### Methods
{{< callout danger >}}
-{{< partial "callout-danger-async-methods.md" >}}
+{{< partial "callouts/danger-async-methods.md" >}}
{{< /callout >}}
Activates your content as a tab element.