Browsers' default CSS for HTML elements

Question

Where can I find a browser's default CSS for HTML elements?

Many HTML elements come with some default CSS properties which can sometimes result in unknown/unwanted behaviour. For example Input boxes are displayed differently in different browsers. I'm looking for a place that covers the new CSS3 properties and the new HTML5 elements.

I've seen in other (much older) questions (such as Browsers' default CSS stylesheets) answers that suggest a solution of CSS reset. This solution is sometimes not wanted, often I would actually like to keep some of the basic properties (such as the highlighting of input boxes in Chrome). In other words: I don't want to get rid of things just because I don't know what they do.

So, Is there a site that can give me all this information (or perhaps most)?

Answer 1

It's different for each browser, so:

• Firefox (Gecko): https://dxr.mozilla.org/mozilla-central/source/layout/style/res/html.css. Or, browse to resource://gre-resources/ and look at html.css.
• Chrome/Safari (WebKit): http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css
  • Chrome (Blink): https://chromium.googlesource.com/chromium/blink/+/master/Source/core/css/html.css
• Internet Explorer (Trident), older versions: http://web.archive.org/web/20170122223926/http://www.iecss.com/

You can also look at the HTML5 Boilerplate stylesheet, which "normalizes the display of a lot of stuff without being a reset in the traditional sense". It also fixes quite a few bugs/inconsistencies.

It's also worth looking at: https://github.com/necolas/normalize.css/blob/master/normalize.css