Use the parts of normalize.css you need from your browserslist
Switch branches/tags
Clone or download
Latest commit e5e3797 Sep 6, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
test 7.0.0 Sep 4, 2018
.appveyor.yml 7.0.0 Sep 4, 2018
.editorconfig 2.1.0 May 26, 2017
.gitignore 5.0.0 Jun 7, 2018
.rollup.js 7.0.0 Sep 4, 2018
.tape.js Add options to allow duplicates or force imports Jun 21, 2017
.travis.yml 5.0.0 Jun 7, 2018
CHANGELOG.md 7.0.1 Sep 6, 2018
CONTRIBUTING.md 6.0.0 Jun 16, 2018
INSTALL.md 7.0.1 Sep 6, 2018
LICENSE.md 5.0.0 Jun 7, 2018
README.md 7.0.1 Sep 6, 2018
index.js 6.0.0 Jun 16, 2018
package.json 7.0.1 Sep 6, 2018

README.md

PostCSS Normalize PostCSS

NPM Version Build Status Support Chat

PostCSS Normalize lets you use the parts of normalize.css you need from your browserslist.

Use @import-normalize to determine where normalize.css rules should be included. Duplicate @import-normalize rules will be removed. See all the Options for more information.

@import-normalize;

Results when browserslist is last 3 versions:

/**
 * Add the correct display in IE 9-.
 */

audio,
video {
  display: inline-block;
}

/**
 * Remove the border on images inside links in IE 10-.
 */

img {
  border-style: none;
}

Results when browserslist is last 2 versions:

/**
 * Remove the border on images inside links in IE 10-.
 */

img {
  border-style: none;
}

PostCSS Normalize uses the non-opinionated version of normalize.css.


Usage

Add PostCSS Normalize to your project:

npm install postcss-normalize --save-dev

Add a browserslist entry in package.json:

{
  "browserslist": "last 2 versions"
}

Use PostCSS Normalize to process your CSS:

import postcssNormalize from 'postcss-normalize';

postcssNormalize.process(YOUR_CSS /*, processOptions, pluginOptions */);

Or use it as a PostCSS plugin:

import postcss from 'postcss';
import postcssNormalize from 'postcss-normalize';

postcss([
  postcssNormalize(/* pluginOptions */)
]).process(YOUR_CSS /*, processOptions */);

PostCSS Normalize runs in all Node environments, with special instructions for:

Node PostCSS CLI Webpack Create React App Gulp Grunt

Options

allowDuplicates

Allows you to insert multiple, duplicate insertions of normalize.css rules. The default is false.

postcssNormalize({
  allowDuplicates: true
});

browsers

Allows you to override of the project’s browserslist for PostCSS Normalize. The default is false.

postcssNormalize({
  browsers: 'last 2 versions'
});

forceImport

Allows you to force an insertion of normalize.css rules at the beginning of the CSS file if no insertion point is specified. The default is false.

postcssNormalize({
  forceImport: true
});