<section>
  <p>this is a normal p inside styled section.</p>
  this is text inside styled section.
 </section>
<section class="revert">
  <p>
    this is a normal p inside revert section.
  </p>
  this is text inside revert section.
</section>
<section>
  <p class="p-revert">this is a revert p inside styled section.</p>
</section>


<div>this is a styled inline div.</div>
<div class="initial">this is an initial div which is inline, not block.</div>
<div class="unset">this is a unset div, still inline.</div>
<div class="revert">this is a revert div. It's rolled back to a block now!</div>

<section>
  <div class="all-revert">i'm black.</div>
</section>

* {
  font-weight: bold;
}

div {
  display: inline;
}

section {
  color: green;
}

.revert, .p-revert {
  color: revert;
  display: revert;
}

.inline {
  display: inline;
}

.initial {
  display: initial;
}

.unset {
  display: unset;
}

.all-revert {
  all: revert;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.