Billy Billy - 1 year ago 81
CSS Question

How to create a nav bar that is absolute and relative footer with an absolute body

I have this so far however how do I ensure I have an absolute body with a relative footer.

<nav class="navbar navbar-inverse navbar-fixed-bottom">
<div class="container-fluid">
<div class="navbar-header">


Answer Source

Make it with absolute and relative positions:

body {
  position: relative;
  height: 999px;
  padding: 0;
  margin: 0;
  background: #f0f0f0;

footer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50px;
  background: gray;

The 'body' is your container and the 'footer' is your nav-bar.

My Fiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download