Render elements consistently. Style with best practices.
Bower
bower install --save sanitize-cssNPM
npm install sanitize.cssSass
@import 'vendors/sanitize.scss';CSS
@import url(vendors/sanitize.css);- CSS inheritance is universal so that styles are easier to control (code).
- The box model is more intuitive with border-box (reference) (reference) (code).
- Smaller font-sizes display consistently across browsers (reference) (code).
- Monospace fonts render consistently (reference) (code).
- Border width works as expected (reference) (code).
- Text selections containing a drop shadow remain legible (reference) (code).
- Content may be hidden from the screen but not screenreaders (reference) (reference) (code).
To give you even more control, sanitize.scss allows you to define your own defaults for box-sizing, font family, monospace font family, text rendering, selection background color, and smaller font size - all without over-declaring them later.
// overwrite defaults in sanitize.scss
$default-font-family: "Open Sans";
$default-text-rendering: optimizeSpeed;
import 'vendors/sanitize.scss';- $default-box-sizing: the default box-sizing is
border-box. - $default-font-family: the default font family is
sans-serif. - $default-text-rendering: the default text-rendering is
optimizeLegibility. - $default-monospace-font-family: the default monospace font is
monospace. - $default-selection-background-color: the default selection background color is
#B3D4FC. - $default-small-font-size: the default small font size is
75%.
At present, we support the current and previous major releases of popular web browsers. When a new version is released, we begin supporting that version and stop supporting the third most recent version.
These browsers currently include Android 4.3-4.4+, Chrome 39-40+, Firefox 34-35+, Internet Explorer 10-11+, iOS 7-8+, Safari 7-8+, Windows Phone 8.1+.
sanitize.css is dedicated to the public domain.