<?xml version="1.0" encoding="utf-8"?>

Resetting all property values in CSS

Resetting all property values in CSS Bad Practice
Resetting all property values in CSS Best Practice

Sometimes, users need to wipe existing styles and start from a clean baseline. That’s exactly what the all property is for. It lets you reset multiple CSS properties at once instead of overriding them one by one.

The all property supports 3 values, each with a slightly different behavior:

  • initial: Resets all affected properties to their default values defined by CSS. It ignores both the element’s previous styles and anything coming from its parent.
  • inherit: Forces all affected properties to take their values from the parent element, even for properties that don’t normally inherit.
  • unset: Acts as a smart reset. If a property normally inherits, it behaves like inherit. If it doesn’t, it falls back to initial.

This makes all especially useful when users want predictable resets without manually checking how each property behaves.

Improve your UX & Product skills with interactive courses that actually work