30-seconds-of-code/snippets/reset-all-styles.md

Reset all styles

Resets all styles to default values with one property. This will not affect direction and unicode-bidi properties.

HTML

<div class="reset-all-styles">
  <h4>Title</h4>
  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure id exercitationem nulla qui repellat laborum vitae, molestias tempora velit natus. Quas, assumenda nisi. Quisquam enim qui iure, consequatur velit sit?</p>
</div>

CSS

.reset-all-styles {
  all: initial;
}

Demo

Title

Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure id exercitationem nulla qui repellat laborum vitae, molestias tempora velit natus. Quas, assumenda nisi. Quisquam enim qui iure, consequatur velit sit?

<style> .snippet-demo__reset-all-styles { all: initial; } </style>

Explanation

The all property allows you to reset all styles (inherited or not) to default values.

Browser support

⚠️ MS Edge status is under consideration.

• https://caniuse.com/#feat=css-all