I have a gap between the content of my website and the bottom of the window that I've been trying to remove for a few days and have not found a solution to. Please see http://bpc.paulsham.com or the image below.
From what I've tried, the <body>
has no margin or padding, the <div id="page-wrapper">
has no bottom margin, and no divs nested in the footer have any bottom margins that should affect it. Using Firebug, it seems like the actual <html>
is pulled up from where the window.
This is a custom theme based on the Bartik default theme of Drupal 7, but I think this is a CSS issue. I am, however, beginning to wonder if this is a doctype issue, but everything seems to be validating fine.
Thank you for your help and please let me know if this requires more information.
#page-wrapper
, add overflow: hidden
to clear the floats.#page-wrapper
, remove the box-shadow
rules.That removes the gap.
I did manage to add back in the shadow while prevent the gap from re-emerging.
It went something like this:
overflow: hidden
to #page
.width
and margin
properties from #page-wrapper
to #page
.box-shadow
properties to #page
.background
s - #page-wrapper
should not have a background
any longer. There's one being applied in a couple of places.