Empty Space at the bottom of the Page

135 Views Asked by Gulam Mohideen At 04 April 2025 at 23:10

A big blank/empty space generated after the footer container. My layout seems to be as

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html xmlns="http://www.w3.org/1999/html">
    <head></head>
    <body id="cms-body" class="yui-skin-sam">
        <div id="mainContainer" class="clearFix">
            <div id="headerDiv"></div>
            <div id="bodyDiv"></div>
            <div id="footerDiv"></div>
        </div>
    </body>
</html>

We are using Yahoo YUI Js/Styles on our application. Issue raised when i navigate from more content page to less content page.

For instance: Big form page to less content page.

Please guide me to resolve the issue.

Thanks in advance.

Original Q&A

There are 4 best solutions below

Gulam Mohideen On 09 December 2013 at 07:25 BEST ANSWER

Problem due to visibility:hidden property of YUI. Instead of it, use display:none property, so, it reduces the blank white space at the footer.

uvais On 03 December 2013 at 07:37

this should be your last div

<div id="footerDiv">

seed On 03 December 2013 at 07:39

Did you specify the height of the parent div?

prabu On 03 December 2013 at 07:39

Can you try the below style property,

#footerDiv{
 bottom: 0px;
 margin-left: 0px;
 position: relative;
}

Empty Space at the bottom of the Page

There are 4 best solutions below

Related Questions in JAVASCRIPT

Related Questions in JQUERY

Related Questions in HTML

Related Questions in CSS

Related Questions in YUI

Trending Questions

Popular # Hahtags

Popular Questions