Default Styles in IE/Moz

Posted on 2003-10-21
Last Modified: 2006-11-17
Is there any part of Internet Explorer or Mozilla Firebird that contains their default stylesheet in CSS format?

I'd like to be able to apply the sheet for one to the other, theoretically as a cheezy way to have content display the same in either browser.  Inspecting the binaries (quickly) I didn't see anything that looked like it would set all/most of the default attributes.

Assuming that there is no built-in file, how can I create the CSS (or equivalent)using JavaScript to extract all of the attributes of all the styles on a page?  I've used getElementById and getElementsByTagName to pull styles before, but I have no idea what I'd use to get every style used on a page, let alone all the styles that didn't get used.  Beyond that even, I haven't seen anything that would let me enumerate all possible sub-styles (color, background-color, etc.) for an element without knowing what it was called.
Question by:DullsVillager
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
LVL 17

Assisted Solution

dorward earned 50 total points
ID: 9597339

Expert Comment

ID: 9601319
I think dorward is thinking in the right direction... I think that even if you do manage to get eh exact defualt stylesheet and apply it to the other browser, there will be some slight differences.

You are far better off if you don't try to make every browser display your page EXACTLY the same. it won't work... and along the way you will have to make many sacrifices in useablity...

Find or make a stylesheet that makes your pages look good in as many brwsers as possible... Remember that looking good does not mean you have to have a pixel-perfect rendering of the page. If that is what you want, you are designing for the wrong medium. Try paper :-)

If you want the default look, just don't use any styling.

On a separate thought, if you are approaching this from a purely intellectual way...
I found this in my installation of Mozzilla Firebird 0.6.2
C:\Program Files\MozillaFirebird\defaults\profile\chrome\userChrome-example.css

I have to say, my favorite line is :
@namespace url(""); /* set default namespace to XUL */
yeah, Ghostbusters.

--start file--

 * Edit this file and copy it as userChrome.css into your
 * profile-directory/chrome/

 * This file can be used to customize the look of Mozilla's user interface
 * You should consider using !important on rules which you want to
 * override default settings.

 * Do not remove the @namespace line -- it's required for correct functioning
@namespace url(""); /* set default namespace to XUL */

 * Some possible accessibility enhancements:
 * Make all the default font sizes 20 pt:
 * * {
 *   font-size: 20pt !important
 * }
 * Make menu items in particular 15 pt instead of the default size:
 * menupopup > * {
 *   font-size: 15pt !important
 * }
 * Give the Location (URL) Bar a fixed-width font
 * #urlbar {
 *    font-family: monospace !important;
 * }

 * Eliminate the throbber and its annoying movement:
 * #throbber-box {
 *   display: none !important;
 * }

 * For more examples see

Author Comment

ID: 9601395
Is it really that futile to try and match between browsers?

If I can style a TD so that it has a one-pixel border, two-pixel padding and six-pixel spacing, why would it look different in different browsers?  (assuming those are the only settable styles for a TD)

I know there's gotta be a way...  still looking for the JavaScript to pull attributes of a style.

(just FYI, i'm a moron and was looking at a phpinfo() sheet, so the ACCEPT header was different, and that's why the particular page I was viewing was considerably different... but it should still be possible!)


Accepted Solution

Fendrin earned 150 total points
ID: 9606342
Well, for starters, some browsers do not understand the box model correctly, and thus will distort just about anything that relies on it. Also, many browsers have problems with styling tables. Some will colapse the borders on those tabls cells. others will not.  Etc.

They shouldn't display significantly differently, but in some cases, they to the why, it is typically caused by an incomplete or incorrect implementation of the standards. Another problem is varying levels of backwards-compatibility. Theoretically, tht should be eliminated by a doctype, but unfortunately, that doesn;t always work. (especially when so many web designers are using a mash of standard and non-standard code... browser developers don't want to keep their users from viewing older sites, so they need backwards compatibility... having backwards compatibility available leads many designers to write out-of-date code.... or worse, mixing concepts. The most hellish thing I have seen was somthing along the lines of <font color=red class=smalltext style="padding-left:5px">)

So can you match between browsers? Yes, if you are careful, limit yourself to certain widely supported selectors, and above all, don't expect pixel perfect rendering. Instead of trying to control everything, control the really important things, and let the browser defaults handle the rest. ( I mean, really, who cares if one browser has the body tag with a few pixels of padding? If that breaks a site, then a  reevaluation of the design is needed)

PS. You aren;t the only moron on EE... I posted the CSS for controlling Mozillas BROWSER, not the default pagestyle! :-)

Expert Comment

ID: 9655879

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

729 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question