Help with Firefox Compatability

[danpoulton]

Hi, I've coded by website using HTML/CSS and it works in IE7 but not FF or Safari. I get extra padding in Firefox and Safari which is not in Internet Explorer.

My CSS is located at http://www.gameslayer.co.uk/css/orange.css and you can see the html at http://www.gameslayer.co.uk/.

I have validated my CSS at the W3C Website and it just looks completely wrong.

[gizmo]

Your heading ought to read 'help with IE compatibility' :D and you should test your site in FF first and then fix the issues with IE as they arise. There are plenty of 'fixes' on this forum for such issues. IE is buggy and only pays lip service to the W3C standards.

[TJ111]

Gizmo is right. Plus with the plethora of development tools you can get for Firefox, developing in IE seems like alot of extra work to me.

Also I notice no difference between IE and Firefox on your site. My only suggestion is make your menu and header images 1 pixel wide, it'll help people on dial up.

Edit: OK I see the problem. Try adding width and height declarations here:

#game_index ul li {

text-decoration:none;

line-height:40px;

margin:2px;

background-image:url('../page-img/orange/banner.png');

}

[drhowarddrfine]

You say you validated your css yet you have an error. You are using the id "current" more than once on the page. id names can only be assigned to one element on a page.

As stated above, always use a modern, standards compliant browser, such as Firefox or Opera or Safari. Then adjust for IEs many quirks and bugs. For further info, see my links below.

[WebJoel]

wow... big stylesheet.

I looked at your html page, -considerably different appearance in IE than in Fx, huh? The 'broken alphabet list' in Fx gets alot worse in IE... effectively chopping the content in two halves and shoving it down the page... :(