[css-d] Height Issue with browsers

George Tue, 03 Jan 2006 05:59:32 -0800

Hi
I'm new to css-discuss and I'm not sure whether this issue has been
raised before.
I need to try and get the #bdyNavMenu and #bdyContent to fill the gap
between the header section of the page and the footer section. The
footer sits at the bottom of the page irrelevant of how much content
there is in the #bdyContent, both
The #bdyNavMenu and #bdyContent divs need to expand down and sit above
the #ftrSection div.


I have no website up at the moments to show the problem, so all I can do
is email the code and hope someone can help.

I'm using the following doc type <!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>

Any help would be appreciated
George

################ CSS Code ################
body
{
    margin: 0px;
    padding: 0px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    background-color: #FFFFFF;
    color: #003366;

}

html, body, #entire {
     min-height: 100%;
     width: 100%;
     height: 100%;
        }

html>body, html>body #entire {
        height: auto;
        }
          
h1, h2, h3, h4, h5, h6
{
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 81%;
    font-style: normal;
    font-weight: normal;
    color: #003366;
    background-color: transparent;
}

a:link
{
    color: #003366;
    background-color: transparent;
    text-decoration: underline;
}
a:visited
{
    color: #003366;
    background-color: transparent;
    text-decoration: underline;
}
a:hover
{
    color: #003366;
    background-color: transparent;
    text-decoration: underline;
}

/*Header Section */
#hdr_Top
{
        width: 100%;
        color: #FFFFFF;
        text-align: right;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        background-color: #336699;
        border-bottom: 1px solid white;
}

/*Work round for IE and FF to stop them adding scroll bars to
side and bottom of window */
.hdrSpanTop
{

        padding-right: 5px;
}

#hdr_2ndCol
{
        width: 100%;
        background-color: #C6CFD6;
        color: #FFFFFF;
        clear: right;
        text-align: left;
        border-bottom: 1px solid #D6B65A;
}

/*Close Header */

/*Start Body */

#bdyNavMenu
{
float: left;
        width: 200px;
        background-color: #C6CFD6;
}

#bdyContent
{
        float: left;
        width: 80%;
        padding-left: 200px;
}
/*Close Body */

/*Start Footer */
#ftrSection {
     position: absolute;
     bottom: 0;
     left: 0;
     width: 100%;
          text-align: center;
     }
/*Close Footer */

######################## Page Code #######################


<%--Header Section --%>
<div id="hdr_Top"><span class="hdrSpanTop">Top</span></div>
<div id="hdr_2ndCol">
<img src="http://localhost/site/images/logo.gif"; /></div>
<%--End Header Section--%>

<%--Start Body Section--%>
<div class="entire">
<div id="bdyNavMenu">Menu</div>
<div id="bdyContent">main content</div>
<%--End Body Section--%>

<%--Start Footer Section--%>
<div id="ftrSection">Footer</div></div>
<%--End Footer Section--%>


______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Height Issue with browsers

Reply via email to