--- layout: examples title: Navbar Template extra_css: - "navbar.css" ---

Matching .container-xl...

# Navbar examples

This example is a quick exercise to illustrate how the navbar and its contents work. Some navbars extend the width of the viewport, others are confined within a `.container`. For positioning of navbars, checkout the }}">top and }}">fixed top examples.

At the smallest breakpoint, the collapse plugin is used to hide the links and show a menu button to toggle the collapsed content.

}}" role="button">View navbar docs »