Large extra space between footer and bottom of page in Internet Explorer

[bevan smith]

Hi

I have created a footer for our company website. The footer displays as desired in Firefox. But in Internet Explorer there is a large gap between it
and the bottom of the page.

It is as if half a page of empty space is added to the bottom of the page under the footer in IE but in Firefox the bottom of the page ends just below the footer.

In IE the display is the same as Firefox except for the added half a page of emptiness below the footer.

I dont know if this will help but I worked in Dreamweaver.

Thank you

Bevan

[_Aerospace_Eng_]

Hi

I have created a footer for our company website. The footer displays as desired in Firefox. But in Internet Explorer there is a large gap between it
and the bottom of the page.

It is as if half a page of empty space is added to the bottom of the page under the footer in IE but in Firefox the bottom of the page ends just below the footer.

In IE the display is the same as Firefox except for the added half a page of emptiness below the footer.

I dont know if this will help but I worked in Dreamweaver.

Thank you

Bevan
Can't help you with out seeing your HTML/CSS. If you have images in there a link would help.

[bevan smith]

Here is my style sheet. I hope it helps. I am quite new to webdesign so my knowledge of all the code is limited.

Thank you



html,body {
margin:0;
padding:0;
height:40%;
padding-bottom: 700px;
padding-left: 5px;
}
#container {
height:auto !important;
height:100%;
min-height:100%;
position:relative;

}
#header {
background:#ff0;
padding:10px;
}
#body {
padding:10px;
padding-bottom:100px; /* Height of the footer */
}
#footer {
position:relative;
bottom:0;
width:50%;
height:20px; /* Height of the footer */
background:#6cf;
text-align: center;
background-color: #FFFFFF;
padding: 7;
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-style: outset;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-top-color: #000000;
border-right-color: #000000;
border-bottom-color: #000000;
border-left-color: #000000;

[_Aerospace_Eng_]

Nope. It appears a majority of your stylesheet is missing and you didn't post your HTML. Is your site online somewhere?

[bevan smith]

Here is the link to the test site

http://solidcad.sigmatek.net/

the problem is in IE so please have a look there

thanks

[abduraooft]

Fix the errors in your markup first, see http://validator.w3.org/check?uri=http%3A%2F%2Fsolidcad.sigmatek.net%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

To begin with, add a proper DOCTYP (http://www.alistapart.com/articles/doctype/)E at the top of your document.

[airforce1]

I think you might resolve this problem by finding the bug code via an add-on called firebug on Firefox.

[_Aerospace_Eng_]

Agreed about the validation. All numbers in CSS should have units except line height e.g. px. You have a few that don't have units. I'm guessing your problem is probably here.
html,body {
margin:0;
padding:0;
height:40%;
padding-bottom: 700px;
padding-left: 5px;
}

Change that to this
html,body {
margin:0;
padding:0;
height:100%;
padding-left: 5px;
}

[lallous]

As Aerospace suggested, check your bottom padding.

If you still need help please continue updating the thread.

[msbtterswrth]

moved. nvm.