Looking for IE6 default styles

[LittleDeveloper]

I am looking for the location of the IE 6.0 default browser style sheet on my Win2000 PC (if it exists in a readable form), or else a URI which documents IE 6.0 default browser styles.

My goal is to build a new cross-browser compatible version of a web site that was originally designed for IE-only. Because I do not have time to do a complete redesign by resetting all browser default styles in the style sheet, I am trying to document exactly what the default browser styles are for IE 6.0 and apply them to my site, forcing all other browsers into compliance.

I believe this will be a cost-effective cross-browser strategy. Unfortunately, the IE default browser style sheet has been exceptionally difficult to locate.

(By the way, Firefox's was easy to find at C:\Program Files\Mozilla Firefox\res\html.css, Netscape at C:\Program Files\Netscape\Netscape Browser\res\html.css, and Safari [on a Mac OS10] at file:///System/Library/Frameworks/WebKit.framework/Versions/A/Frameworks/WebCore.framework/Versions/A/Resources/html4.css.)

I searched my hard drive for obscure, but essential default style text, and came to the conclusion that Microsoft does not document this stuff in readable form on my computer. I didn't find it documented on the web.

I hope I am proven wrong on that. Microsoft e-mailed me back and said something inane about using DHTML. Any tips?

 

[BabyJeffy]

How are you going to address IE specific markup that may have been used? What about differences in the box-model? What doctype are you aiming to validate against?

I just don't think you are going to be successful by "diffing" the default CSS stylesheets for the various browsers (since it's the interaction between the markup and the css that causes the differences in the first place).

I'd be interested to know if this does actually "save time" so to speak. My guess is that you will get about 80% of the way there and be unable to continue without changing the way the page is structured. That's personal opinion, however.

Cheers,
Jeff

[tt]Jeff's Page @ Code Couch

http://www.codecouch.com/jeff/

http://www.codecouch.com/jeff/blog/

[/tt]

What is Javascript? FAQ216-6094

 

[ChrisHunt]

I believe this will be a cost-effective cross-browser strategy.

I believe you are mistaken.

The problem most designed-for-IE-only sites experience when you fire them up in something up-to-date is that they're written to expect IE's buggy implementation of CSS/HTML and can't cope with browsers that interpret it correctly.

Knowing what IE's default presentation of a given object won't really help you fix any but the most minor differences. Sure you might get it to show, say, the exact same number of pixel top & bottom margins on a <h1> element, but who cares? It won't help if you page layout is screwed up by IE's mis-handling of [tt]height[/tt] and [tt]width[/tt].

What I suggest you do is...
[ol]
[li]Specify a complete DOCTYPE (Google for it) for your pages, if you aren't already doing so. Be warned that this may mess up your layout in IE too, as it switches from Quirks mode to as-close-to-standards-compliance-as-IE-gets mode.
[/li]
[li]Validate your pages - no need to have stupid errors foul them up.
[/li]
[li]Fix whatever you have to in your CSS, and on your pages, to get the layout working correctly.
[/li]
[li]Fix any remaining superficial differences between browsers that you have time and inclination for. Bear in mind that it's impossible to have pixel-perfect identical rendering between all browsers. Fortunately it's also unnecessary.[/li]
[/ol]

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd

 

[LittleDeveloper]

I appreciate the input on this topic. Before I am persuaded to give up on this direction, however, let me offer some relevant details I left out, given that our situation is far from ideal:

Fix whatever you have to in your CSS, and on your pages,

We operate a "learning management system", which is essentially a content managment setup where we only want to change the scripts, styles, and containing frames. Any global change to content is inherently risky and strongly discouraged by "the man" (the man who would have to do it ;-).

How are you going to address IE specific markup?

I've spent the last 5 years clobbering anyone who wrote IE-specific markup, even though our site was IE-only, in anticipation of upgrading our site, as we are now.

What about differences in the box-model? What doctype are you aiming to validate against

As of today, my associate is strongly advocating switching everything from quirks mode to the transitional DOCTYPE (standards mode). He has already tackled the box model issue. Fortunately, our content is free of this problem (it's quite plain in terms of presentation). Many other content quirks have already been addressed by the automating of our content-to-code conversion process, which has been programmed with standards mode in view. As for the rest of the site, at least that one issue has been accounted for by changing markup. (About time, yes.)

Sure you might get it to show, say, the exact same number of pixel top & bottom margins on a <h1> element, but who cares?

Our directive is now to "support" Firefox 1.5 and Netscape 8 to comply with our vendor's new software. For us, this means that things like scroll bars covering up content in a fixed-width frame in Firefox will not be acceptable. Redesigning with a "fluid design" is not an option, as we are stuck with our vendor for now. What we can change is limited (like the style sheet), so we want to make it really count.

Knowing what IE's default presentation of a given object won't really help you fix any but the most minor differences

We want our version change to go over well. Then we can make the case to get rid of our vendor and build our own dream site from scratch. Until then, certain "minor browser differences" are causing us headaches.

How I got started on this quest for default browser styles

It all started when I saw my associate tearing his hair out trying to get IE and FF content to both fit in our vendor's "box". I noticed that P margin and line-spacing diffs were causing problems, so I reverse-engineered a style sheet to make paragraphs render as in IE by comparing styled to unstyled (all in quirks mode) until I got them to look exactly the same in IE6, and then FF1.5 and NN8 followed suit quite accurately. Then I tested in quirks vs. standards mode, and got exactly the same results. (And I added info about recommended font-size settings in Firefox to our system requirements to account for user-agent settings. Yes, ugly, but I was asked to do it by "the man".) We added this info to our style sheet, and that solved the problem for my associate... until he encountered another similar problem. I started a mental list of what would come next....

Then I thought, why not get some documentation for all the browser defaults in IE6 and apply all the important ones in one shot?

So, bad idea?

But aside from quirks mode issues, is setting the site style sheet with IE browser defaults really such a bad idea in this circumstance?

Since Microsoft apparently refuses to document these default styles for IE6, I thought this would be a worthwhile challenge. I want to give my associates some hope.

 

[BabyJeffy]

Well, after reading your replies... it doesn't sound quite as grim as I had at first thought. I still think it's a waste trying to compare default internal styles - but agree that the approach (of resetting styles to a known default) is a valid solution (especially for your scenario).

So... instead of analysing every individual tag etc... how about you just set all padding and margins to 0 for all elements (ok, you don't need to do all). FORM, FIELDSET, LEGEND, UL, LI, P, H1..H6 are the ones that immediately spring to mind.

I would "reset" the font size as well (so it works the same across all browsers - excepting that IE won't scale font size if you use pixels). Here is a style that I use for this:

/* Set default font size to 16px for Safari */
html>body {
	font-size: 16px; /* IE can't read this */
}
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%; 		/* For IE */
}

Anyway, hope it works out for you

Cheers,
Jeff

[tt]Jeff's Page @ Code Couch

http://www.codecouch.com/jeff/

http://www.codecouch.com/jeff/blog/

[/tt]

What is Javascript? FAQ216-6094

 

[BillyRayPreachersSon]

I'm with Jeff on this one. Trying to build CSS to get each browser type looking like another purely by setting specifics that are different is pointless - for many reasons, including:

- The "default CSS" may not be the same from one revision of each browser to the next, but more importantly (and Jeff covers this),

- It's a lot easier, quicker, and smaller, just to set all styles to how you want them to be.

Hope this helps,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[LittleDeveloper]

I will pass this advice on to my associates. No one likes to risk breaking the unbroken, but it seems the reset approach to CSS may have a bigger payoff in the end, especially going forward. I still wish I could find documentation of IE default styles, though, as a point of reference. Thanks.

Craig