Let parent CSS rule overwrite child CSS rule?

Normally a more specific CSS rule has priority over the more general rule e.g.

“`
<header class=”foobar”> //width=1200px
<div>
<P> ….</P> //width=860px;
</div>
</header>
“`

But is there a way to let a parent element force to recursively overwrite all nested child CSS rules?

In the sample above the header width instruction should overwrite the inner P width instruction.

In general all nested width instructions should be overwritten.

If a nested element has no width instruction nothing should happen.

How can I write such a CSS (or javascript?) instruction?

Advanced related question:

How can I restrict the width instruction to only childs (=next lower hierarchy level)?

Peter

Also in #CSS _↴