extends ../_bootstrap append styles // Custom styles for this template link(href='/css/sticky-footer-navbar.css', rel='stylesheet') block body // Fixed navbar nav.navbar.navbar-default.navbar-fixed-top .container .navbar-header button.navbar-toggle.collapsed(type='button', data-toggle='collapse', data-target='#navbar', aria-expanded='false', aria-controls='navbar') span.sr-only Toggle navigation span.icon-bar span.icon-bar span.icon-bar a.navbar-brand(href='#') Project name #navbar.collapse.navbar-collapse ul.nav.navbar-nav li.active a(href='#') Home li a(href='#about') About li a(href='#contact') Contact li.dropdown a.dropdown-toggle(href='#', data-toggle='dropdown', role='button', aria-expanded='false') | Dropdown span.caret ul.dropdown-menu(role='menu') li a(href='#') Action li a(href='#') Another action li a(href='#') Something else here li.divider li.dropdown-header Nav header li a(href='#') Separated link li a(href='#') One more separated link .container .page-header h1 Sticky footer with fixed navbar p.lead | Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS. A fixed navbar has been added with code padding-top: 60px; | on the code body > .container | . p | Back to a(href='../sticky-footer') the default sticky footer | minus the navbar. footer.footer .container p.text-muted Place sticky footer content here.