Hi fortune68,

To fix the layout problem all you have to do is specify the width for the div with the class "Content". Add the "width" property to the .Content class on your style sheet. After that the site will look exactly the same on both browsers.

.Content { width:710px; }

However, even after you fix this you really should clean up your code. It's not that bad but it has a lot o redundant spans and deprecated font tags.

Here are a few guidelines that I'm sure will help you with this task:

1. Remove all font tags from your code.
2. Remove all redundant span and div tags from your code.
3. Since this is a small site, it would be more manageable to keep the style sheet rules on one file. There are duplicated rules on your style sheets. Remember that rules loaded last will override earlier style sheet rules.
4. Validate your code to verify other html errors.

Tip: A technique that I always use is to add borders to all spans and divs on the page to help me quickly spot layout problems with margins, paddings and widths when adjusting layouts.

Here's how:

1. Add the following css rules to the end of your style sheet:

div {border:1px solid red; padding:1px;}
span {border:1px solid green; padding:1px; float:left;}

On your case you can do that for font tags as well. Let's use a different color for that.

font {border:1px solid yellow;}

The 1px padding will add 1px gap between nested divs and spans to better visualize what's going on on the page.
The float:left; is only needed for Firefox to expand those empty spans you have on the page.

2. Look at the page and you will see a lot of divs and spans you never knew existed.

3. After removing all redundant tags, change the padding to 0px on the rules above and check your page again. If everything looks good you can now delete these two rules from your style sheet.

Thanks.