Vertical alignment for the page to 100% of height

Question

I have page http://inspire.mobi/how , where it is aligned horizontally well ut it is not properly aligned vertically.

For this page http://inspire.mobi/how , there are 2 divs ( having css classes mainHow & botHow) in the body part. Both these divs are in one main div "mainHow" whose height is calculated using javascript (wondow.height- footerheight-headerheight). Internal 2 divs (having css classes mainHow & botHow) are 75% & 25% of the main div "mainHow". But it is not covering full height. When i zommin & zoom out the page (not 100% page size), it is creating too much part leftout below "bothow" div.

Please help me on this.

Answer 1

I had a look at this site and i can see a few errors that might be causing it.

Your divs mainHow & botHow, height are adding up to 105%.

In your javascript that you have set up to work out .container height, your footer height that you have hardcoded is set to 110px, im seeing the footer hieght as 91px, so you will have a gap there. If you fixed this, it should be the full size. If im understanding the question right