I have defined this CSS rule:
*,
*::before,
*::after {
box-sizing: border-box
}
What if we want to exclude only a specific element with this class .testim
?
I have defined this CSS rule:
*,
*::before,
*::after {
box-sizing: border-box
}
What if we want to exclude only a specific element with this class .testim
?
Its very simple; If I correct undertood then;
.testim,
.testim::before,
.testim::after{
box-sizing: unset;
}
The unset CSS keyword resets a property to its inherited value if the property naturally inherits from its parent, and to its initial value if not.
More info for CSS unset
value.
:not()
is like *
. It selects every element apart from the element in its brackets. (https://developer.mozilla.org/en-US/docs/Web/CSS/:not).
:not(.testim), *::before, *::after {
box-sizing: border-box;
}
div {
width: 200px;
border: 20px solid black;
}
.testim {
width: 200px;
border: 20px solid black;
}
<div>I am div with width: 200px and border: 20px.</div>
<hr>
<div class="testim">I am of the class testim with width: 200px and border: 20px.</div>