[Solved] Sticky Footer Causing Problems

[iancoates]

Hi all,

I wonder if anyone could have a look at my css code as i’ve tried to add the sticky footy from this site. It works with chrome and firefox but leaves a massive gap with ie8.

here’s the site
http://speedway-stats.99k.org/

here’s the css

Code:

* {margin: 0;}

html, body, #wrap {height: 100%;}

body > #wrap {height: auto; min-height: 100%;}

#header
{
width:99%;

padding-left: 0em;
padding-top: 0em;
}

h3{font-family: arial;
font-size: 18px;
font-style: bold;}

h4{font-family: arial;
font-size: 12px;}

h5{font-family: arial;
font-size: 16px;
font-style: bold;}

p.cont{
font-size: 12px;
font-family: Arial;}

a{text-decoration: none;
font-color:blue;}
a:link{text-decoration: none;}
a:visited{text-decoration: none;
font-color:blue;}
a:active{text-decoration: none;}
A:hover{text-decoration: underline;}

#container{
width: 80%;
margin: 0px auto;
background-color: #fff;
line-height: 130%;
padding-bottom: 30px;} /* must be same height as the footer */

#top{
width:99%;
padding-left: 0em;
padding-bottom: 0em;
background-color: white;
border-bottom: 3px;
border-color:#e60;
border-bottom-style:solid;}

#topper{
width:99%;
padding:1em;
background-color: white;}

#top h1
{
padding: 0;
margin: 0;
}

#leftnav
{
float: left;
width: 160px;
margin: 0px;
padding: 1em;
}

#rightnav
{
float: right;
width: 160px;
margin: 0;
padding: 1em;
}

#content
{
margin-left: 200px;
border-left: 1px solid gray;
margin-right: 200px;
border-right: 0px solid gray;
padding: 1em;
max-width: 36em;
padding-bottom: 3em;
}

#footer
{
position: relative;
margin-top: -30px; /* negative value of footer height */
height: 30px;
clear:both;

padding-top: 0.5em;
padding-left: 1em;
width:99%;
background-color: #ddd;
border-top: 1px solid gray;
}

.clearfix:after {content: “.”;
display: block;
height: 0;
clear: both;
visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac */
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

[iancoates]

OOh errr,

Seems to be ok now, looks like the html <!–xxxxx—-!> was the problem. Wierd.

Would still appreciate any critique.

Ian

[iancoates]

How do i get rid of the horizontal scroll bar, i can’t see anything obvious

[iancoates]

I’m afraid that hasn’t cracked it.

ian

[iancoates]

Cracked it, thanks very much

ian

[Author]

Posts