CSS Forum

**fwnow** · 02-02-2009, 10:29 PM

I have the following CSS footer which works fine with Firefox, but not IE 7. I'm trying to center the footer, but it shows on the left side with IE 7:

.footer {
background-color: #CDEB8B;
color: #36393D;
text-align: center;
padding: 15px;
margin: 10px 10px 10px 115px;
font-size: 90%;
clear: left;
width: 745px;
background-position: top center;
}

**stevej** · 02-02-2009, 11:12 PM

Are you trying to center the element footer, or the text inside? I'm guessing it has something to do with clear: left;, but I'm not sure. Could we have some html code?

- Steve

**fwnow** · 02-03-2009, 03:38 AM

I change the code to the one below, but still look different in EI 7. It looks perfect on Firefox, but on IE7 the footer looks smaller then the main div.

I'm not trying to center the text, but the background. Or the whole footer which is a rectangle.

.footer {
background-color: #CDEB8B;
color: #36393D;
text-align: center;
padding: 15px;
margin-left: auto;
margin-right: auto;
width: 50em;
font-size: 90%;
clear: left;
width: 740px;
}

**stevej** · 01:24 PM

Could I have some HTML code and maybe the CSS of the surrounding elements? I can't really know what the problem is if I can't see how you're using the CSS. But I'm sure it would fix a lot of problems if you used the right DOCTYPE. EDIT: I grabbed a doctype and threw in in with the code. Now it works perfectly with IE7. I used:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Never underestimate the power of a proper doctype!

- Steve