Monday, August 17, 2015

Normalize.css, an alternative to CSS resets

From [1]:

Normalize.css is a small CSS file that provides better cross-browser consistency in the default styling of HTML elements. It’s a modern, HTML5-ready, alternative to the traditional CSS reset.

From [7]:

A CSS Reset (or “Reset CSS”) is a short, often compressed (minified) set of CSS rules that resets the styling of all HTML elements to a consistent baseline.

In case you didn’t know, every browser has its own default ‘user agent’ stylesheet, that it uses to make unstyled websites appear more legible. For example, most browsers by default make links blue and visited links purple, give tables a certain amount of border and padding, apply variable font-sizes to H1, H2, H3 etc. and a certain amount of padding to almost everything. Ever wondered why Submit buttons look different in every browser?

Obviously this creates a certain amount of headaches for CSS authors, who can’t work out how to make their websites look the same in every browser. (NB: article coming soon about why this is a false notion!)

Using a CSS Reset, CSS authors can force every browser to have all its styles reset to null, thus avoiding cross-browser differences as much as possible.


[1] About normalize.css
[2] https://github.com/necolas/normalize.css/
[3] https://necolas.github.io/normalize.css/
[4] Applying Normalize.css Browser Reset CSS (video)

[5] CSS Tools: Reset CSS
[6] http://cssreset.com 2015’s most popular CSS Reset scripts, all in one place.
[7] What Is A CSS Reset?
[8] http://stackoverflow.com/questions/6887336/what-is-the-difference-between-normalize-css-and-reset-css

No comments:

Blog Archive

Followers