the new CSS reset, using new css features
npm install the-new-css-resetIt doesn't affect the display property and special HTML elements like ``iframe`, `canvas`, `img`, `svg` and `video`.
This package is using the new CSS features:
- The global CSS reset keywords, unset and revert keywords.all
- The new property of which can reset all properties combined.`
- The :where()` pseudo-class to remove specificity.`
- The :not()` pseudo-class with multi arguments.
property.How to get started?
Run `npm i the-new-css-reset` OR Download the Latest Version.Once installed, you can use it in two different ways:
1) Import
`/css/reset.css` before the regular styles of the project.
2) Include the following snippet in one of the JavaScript/TypeScript entry files:
`js
import "the-new-css-reset/css/reset.css";
`Want to exclude some of the resets?
You can revert to the default styles of the browser!
For example:
`css
input[type="checkbox"],
input[type="radio"] {
all: revert;
}
`
or all input elements:
`css
input,
textarea,
select {
all: revert;
}
`Accessibility Recommendation
To keep your website accessible, don't forget to take care of the
`:focus` states.
`css
:focus { / focus styles / }/ or/and /
:focus-visible { / keyboard only focus styles / }
``!Chrome | !Edge | !Firefox | !Safari | !Opera | !Samsung Internet
--- | --- | --- | --- | --- | --- |
88+ ✔ | 88+ ✔ | 84+ ✔ | 14+ ✔ | 75+ ✔ | 15+ ✔ |