Difference between revisions of "Team:BABS UNSW Australia"
| Line 1: | Line 1: | ||
{{BABS_UNSW_Australia}} | {{BABS_UNSW_Australia}} | ||
<html> | <html> | ||
| + | <style> | ||
| + | /* Sticky footer styles | ||
| + | -------------------------------------------------- */ | ||
| + | html { | ||
| + | position: relative; | ||
| + | min-height: 100%; | ||
| + | } | ||
| + | body { | ||
| + | /* Margin bottom by footer height */ | ||
| + | margin-bottom: 60px; | ||
| + | } | ||
| + | .footer { | ||
| + | position: absolute; | ||
| + | bottom: 0; | ||
| + | width: 100%; | ||
| + | /* Set the fixed height of the footer here */ | ||
| + | height: 60px; | ||
| + | background-color: #f5f5f5; | ||
| + | } | ||
| + | |||
| + | |||
| + | /* Custom page CSS | ||
| + | -------------------------------------------------- */ | ||
| + | /* Not required for template or sticky footer method. */ | ||
| + | |||
| + | .container { | ||
| + | width: auto; | ||
| + | max-width: 680px; | ||
| + | padding: 0 15px; | ||
| + | } | ||
| + | .container .text-muted { | ||
| + | margin: 20px 0; | ||
| + | } | ||
| + | </style> | ||
<nav class="navbar navbar-default navbar-fixed-top navbar-inverse" style="margin-top:16px"> | <nav class="navbar navbar-default navbar-fixed-top navbar-inverse" style="margin-top:16px"> | ||
<div class="container-fluid"> | <div class="container-fluid"> | ||
Revision as of 06:07, 2 July 2015
Sticky footer
Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.
Use the sticky footer with a fixed navbar if need be, too.