thatsus/bs-normalize

normalize.css v3

Normalize.css is a customisable CSS file that makes browsers render all elements more consistently and in line with modern standards., _(*1)

The project relies on researching the differences between default browser styles in order to precisely target only the styles that need or benefit from normalizing., _(*2)

View the test file, _(*3)

Install

• npm: npm install --save normalize.css
• cdnjs
• Download.

No other styles should come before Normalize.css., _(*4)

It is recommended that you include the normalize.css file as untouched library code., _(*5)

What does it do?

• Preserves useful defaults, unlike many CSS resets.
• Normalizes styles for a wide range of elements.
• Corrects bugs and common browser inconsistencies.
• Improves usability with subtle improvements.
• Explains what code does using detailed comments.

Browser support

• Chrome (latest)
• Edge (latest)
• Firefox (latest)
• Firefox ESR
• Internet Explorer 8+
• Opera (latest)
• Safari 6+

Normalize.css v1 provides legacy browser support (IE 6+, Safari 4+), but is no longer actively developed., _(*6)

Extended details

Additional detail and explanation of the esoteric parts of normalize.css., _(*7)

pre, code, kbd, samp

The font-family: monospace, monospace hack fixes the inheritance and scaling of font-size for preformatted text. The duplication of monospace is intentional. Source., _(*8)

sub, sup

Normally, using sub or sup affects the line-box height of text in all browsers. Source., _(*9)

svg:not(:root)

Adding overflow: hidden fixes IE9's SVG rendering. Earlier versions of IE don't support SVG, so we can safely use the :not() and :root selectors that modern browsers use in the default UA stylesheets to apply this style. SVG Mailing List discussion, _(*10)

input[type="search"]

The search input is not fully stylable by default. In Chrome and Safari on OSX/iOS you can't control font, padding, border, or background. In Chrome and Safari on Windows you can't control border properly. It will apply border-width but will only show a border color (which cannot be controlled) for the outer 1px of that border. Applying -webkit-appearance: textfield addresses these issues without removing the benefits of search inputs (e.g. showing past searches)., _(*11)

legend

Adding border: 0 corrects an IE 8–11 bug where color (yes, color) is not inherited by legend., _(*12)

Contributing

Please read the contribution guidelines., _(*13)

Acknowledgements

Normalize.css is a project by Nicolas Gallagher, co-created with Jonathan Neal., _(*14)