My site, FireFox issues

virtuexru

Limp Gawd
Joined
Jul 6, 2005
Messages
218
OK So this is my new website I am currently working on:

www.corporatesector.org

Click the text to get to the main page.

So here is the problem.

If you look at it in Internet Explorer, it looks exactly how its suppose to, everything is fine w/ the tables and borders.

However in FireFox, the borders are screwed up which messes up how they are aligned. Is there anyway to fix this? My code is very clean so I don't know, maybe its just a border="" issue w/ FireFox?
 
I'd say it's an issue of quirks vs standards mode, as IE really changes its box model between the two. At a glance, the problem appears to be width including vs not including margin.

//edit: upon closer examination, ouch! no CSS to speak of. That makes it really tough to quickly track down issues like this.

Here's my quick analysis: you need to move all those HTML attributes to CSS for one. You need to remove redundant / conflicting directives for two. For example, a table width 1024 with a border width of 1 is content-width 1022 (before padding, ignoring margin). You then define internal elements to have width 1024. That won't fly, and is wholly unnecessary. Table rows always fill the table width if you leave out that attribute.

So, here's how to fix it:
define site width in the <div>. Make that 1024 (or whatever). Leave ALL widths out of your tables except for where you have 3 cols. Better yet, change all those tables to divs, as many of them are one cell anyway. That's optional, though. Now specify all paddings / margins. Leaving things at default values is a great way to get pixel discrepancies across browsers.

//edit 2: finally, before you say you have "clean code", make sure you have a valid <head>...<body> transition. Uncomment your style block, ditch the <br>, etc.
 
freaking god above me... I fixed everything thanks so much. its ALOT cleaner now haha.
 
Back
Top