Adding a CSS Reset

This project setup uses PostCSS Normalize for adding a CSS Reset.

To start using it, add @import-normalize; anywhere in your CSS file(s). You only need to include it once and duplicate imports are automatically removed. Since you only need to include it once, a good place to add it is index.css or App.css.

index.css

  1. @import-normalize; /* bring in normalize.css styles */
  3. /* rest of app styles */

You can control which parts of normalize.css to use via your project's browserslist.

Results when browserslist is last 3 versions:

  1. /**
  2.  * Add the correct display in IE 9-.
  3.  */
  5. audio,
  6. video {
  7.   display: inline-block;
  8. }
  10. /**
  11.  * Remove the border on images inside links in IE 10-.
  12.  */
  14. img {
  15.   border-style: none;
  16. }

Results when browserslist is last 2 versions:

  1. /**
  2.  * Remove the border on images inside links in IE 10-.
  3.  */
  5. img {
  6.   border-style: none;
  7. }

Browser support

Browser support is dictated by what normalize.css supports. As of this writing, it includes:

  • Chrome (last 3)
  • Edge (last 3)
  • Firefox (last 3)
  • Firefox ESR
  • Opera (last 3)
  • Safari (last 3)
  • iOS Safari (last 2)
  • Internet Explorer 9+