Looks different in FF and IE

I downloaded firefox today so I could view my website in it and compare with IE. It all looks the same apart from the stuff at the bottom, which looks off. I've taken a screenshot to show the differences I'm seeing, do you have any idea of ways I can fix this?

For reference, the website in question is in my signature

Just a point I'd like to add, the website is supposed to look how it does in internet explorer. The problem is the content you see (copyright and banner) should be in the box and they're not in FF

 

What works in IE doesn't always work in Firefox and vice versa.

I would consider checking your code to make sure there are no errors in it.

 

At the bottom of my page there is a box which contains the copyright information, that banner and a few div includes which you can't see as they're currently empty. In firefox, the aforementioned items aren't in the box, they are out of it and below it.

 

IE and Firefox does not implement CSS the same way. Firefox is W3-standards compliant, and IE is not. I think it would be wize to check the net to find out the differences between IE and Firefox, and see if any of them apply to your CSS-solution.

OTOH, it could also be that you have errors in your code that Firefox ignores and IE catches.

 

(Disclaimer: a little busy, so this is just based on what typically works for me when I come across stuff like this - didn't really check your site)

Try adding the following after the paragraph:

<div style="clear:both"></div>

Code (markup):

Or, you could just create a DIV for this purpose:

[I][SIZE="2"]In you stylesheet:[/SIZE][/I]
.clear {  clear:both;  }

[I][SIZE="2"]In your markup:[/SIZE][/I]
<div class="clear"></div>

Code (markup):

Exact same outcome...

 

This is the culprit

#footer{
	clear: both;
	text-align: center;
	[color=red]height: 40px;[/color]
	margin: 0;
	padding: 0;
	background-color: #f9f9f9;
	border: 1px solid #333333;
}

Code (markup):

IE quite wrongly expands a sized container to enclose its content. Modern browsers correctly allow the excess content to overflow. Remove the height property and all will be well.

cheers,

gary