I've searched for a Drupal-friendly sticky footer solution for the Acquia Marina theme for Drupal 7, but I couldn't find anything.

2 examples are given here for Drupal 6: http://drupal.org/node/554048. The first solution is JavaScript-based and the second is CSS-based.

Will the CSS/JS examples given work for Drupal 7? If not, can anyone suggest a simple solution to get the footer to stick to the bottom of the browser window?

My site is running drupal-7.10, fusion-7.x-1.x-dev and acquia_marina-7.x-1.x-dev.

  • Does your footer has a fixed height ?
    – tostinni
    Commented Jan 6, 2012 at 15:24

1 Answer 1


The CSS solution should be implemented the same way in Drupal 7.

Here is the javascript code updated to Drupal 7.

(function ($) {
Drupal.behaviors.acquia_marinaStickyFooter = {
  attach: function (context, settings) {
    var footer_height = $('#footer').height();
    var footer_pos = $('#footer').position();
    var window_height = $(window).height();
    var page_height = $('#page').height();
    var page_pos = $('#page').position();
    var page_total = page_pos.top + page_height;
    var footer_new_pos = window_height - footer_height - page_total;
    var test = footer_height + page_total;
    if (test <= window_height) {
      if (footer_pos.top < window_height) {
        $('#footer').css('position', 'relative');
        $('#footer').css('margin-top', footer_new_pos);

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.