Fix #952 - Force the footer to the bottom of the page

This commit is contained in:
Jessica Tallon 2014-09-30 11:23:24 +01:00
parent eddb1aaf9e
commit ec84acacdc
2 changed files with 144 additions and 125 deletions

View File

@ -25,7 +25,7 @@
src: local('Lato Regular'), local('Lato-Regular'), url('../fonts/Lato-Regular.ttf') format('truetype'); src: local('Lato Regular'), local('Lato-Regular'), url('../fonts/Lato-Regular.ttf') format('truetype');
} }
body { html, body {
background-color: #161616; background-color: #161616;
color: #C3C3C3; color: #C3C3C3;
padding: 0; padding: 0;
@ -110,6 +110,23 @@ input, textarea {
/* website structure */ /* website structure */
#wrap {
min-height: 100%;
height: auto;
/* This must be equal to the footer height + 5px */
margin-bottom: -35px;
}
#wrap:after {
content: "";
display: block;
}
footer, #wrap:after {
height: 30px;
}
header { header {
width: 100%; width: 100%;
padding: 0; padding: 0;
@ -176,9 +193,7 @@ a.logo {
footer { footer {
width: 100%; width: 100%;
height: 30px;
border-top: 1px solid #333; border-top: 1px solid #333;
bottom: 0px;
padding: 8px 0; padding: 8px 0;
text-align: center; text-align: center;
font-size: 0.875em; font-size: 0.875em;

View File

@ -62,6 +62,7 @@
<body> <body>
{% include 'mediagoblin/bits/body_start.html' %} {% include 'mediagoblin/bits/body_start.html' %}
{% block mediagoblin_body %} {% block mediagoblin_body %}
<div id="wrap">
{% block mediagoblin_header %} {% block mediagoblin_header %}
<div class="container"> <div class="container">
<header> <header>
@ -192,6 +193,9 @@
{% template_hook("persona_form") %} {% template_hook("persona_form") %}
{% endif %} {% endif %}
</div> </div>
</div>
</div>
<div class="container">
{%- include "mediagoblin/bits/base_footer.html" %} {%- include "mediagoblin/bits/base_footer.html" %}
</div> </div>
{%- endblock mediagoblin_body %} {%- endblock mediagoblin_body %}