So when just starting to build out my website.
Background Gradients are not working with Boostrap 3.0
background: #000000; /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #000000 , #434343); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #000000 , #434343); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
the reason why this happens is because you are giving body the
this means that the height of the body will be calculated by the browser. but when you add
navbar-fixed-bottom you add the fixed position to so the navbar height won't affect the body height and the browser calculates it as 0 height and the gradient is not shown.
if you change
you tell the browser that you want the height 100% of the html. and the gradient will show since the body will show.