The all property resets all element properties.
Their values are reset to their default or inherited values.
This property is used to reset styles and start with a clean slate.
A child element with all set to initial.
<div style="color: red;">
<div style="all: initial;">
The style in this element is reset
to its initial or default value.
</div>
</div>
The container defines a red color which is inherited by its children.
However, the child element has an all:initial value.
The parent style is not inherited and the child uses initial values.
The all property resets an element's properties to their initial values.
This property is used in complex CSS situations to start with a clean slate.
Valid property values include: initial, inherited, and specified values.
The direction and unicode-bidi properties cannot be reset using all.
unicode-bidi property is used together with the direction property to specify whether the originial text can be overridden to support multiple languages.
It is used by right-to-left written languages such as Arabic or Hebrew.
all property.
all: initial | inherit | unset;
| Value | Description |
|---|---|
| initial | Resets to the initial value |
| inherit | Inherits the parent's value |
| unset | Inherits all possible values from the parent. If no inheritable value is available for the property, the initial value is used. |
Click the buttons to see the different all values.
<style>
.my-all {
all: unset;
}
</style>
<div style="color: orangered; ">
<div class="my-all">
The style of this element is reset
depending on the all value
</div>
</div>
This table shows when all support started for each browser.
 Chrome
|
37.0 | Aug 2014 |
 Firefox
|
27.0 | Feb 2014 |
 IE/Edge
|
Not supported | |
 Opera
|
24.0 | Sep 2014 |
 Safari
|
9.1 | Mar 2016 |
