Question

Made a Wordpress installation, styled a blog. The Blog

The problem: I have a fixed footer and a scrollable main page. No matter what I seem to do, there's always a space from like 10px between the footer and the main body.

I've inspected with Firebug, went through the CSS and the html. I gave the main div margin and padding and even a border-bottom.. but does not seem to help. It changes something, but the space still remains.

Of course, I could set the padding from the footer to bottom 10px, but then I would have unwanted space beneath the footer.

I can't really post any code here, since this is Wordpress and I honestly wouldn't know what code you could need, since I don't know where the problem is.

Thanks everyone in advance!

Was it helpful?

Solution

It's the margin bottom on element

 <div id="page" class="hfeed site">

from this style:

body .site {
margin-bottom: 3.42857rem;
}

Removing this style gets rid of the space (and as far as I can see doesn't cause any other display issue with the site.

You can find these kind of issues by using the Developer Tools in your browser (the Firebug plugin for Firefox for example) and just right-clicking on the area with the issue and exploring and dynamically editing or disabling the styles that are applied to an element.

OTHER TIPS

Well if you really want to remove the gap between the body and the footer, Just get the rid of height:40px that you've set in the footer CSS.

This is only i can do without code!
Hope this will help.

Here is the screen-shot

enter image description here

Just remove the height:40px rule from style.css (row 771)

on your style.css line 121 add this table { float: left; }

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top