How can I override inline styles on contained elements with CSS?

Question

In the following snippet, I want to override the inline style so h1 , h2 , h3 , h4 tags have the style written in the CSS file.

• I cannot/allowed to remove the inline style (it is produced by an HTML editor named Froala)
• We don't know the inline style applied to which element, it might be the h tag itself or span or any other child/nested element.
• We don't know how many nested elements exist.
• For ease, we can assume that inline style is always applied to span but span can be n-th child

 .wrapper{} h1,h2,h3,h4 {line-height:1.5 !important;} h1,h2 > span {color:rgb(41,105,176) !important;} h3,h4 > span {color:rgb(184, 49, 47) !important;}

 <div class="wrapper"> <h1>Dyspepsi</h1> <h2><span style="color: rgb(0,0,0);">Dyspepsi</span></h2> <h1><strong><em><span style="color: rgb(0,0,0); line-height:2.5">Dyspepsi</span></em></strong></h1> <h2><strong><em><span style="color: rgb(0,0,0);">Dyspepsi</span></em></strong></h2> <h3><strong><span style="color: rgb(0,0,0); border-bottom: 1px solid;">Dyspepsi</span></strong></h3> <h4><strong><em><span style="color: rgb(0,0,0);">Dyspepsi</span></em></strong></h4> </div>

Answer 1

You can use the "all" selector * in combination (as a child) of the heading selectors in addition to the regular h1 to h4 selectors, plus !important on all of them:

 h1, h1 *, h2, h2 *, h3, h3 *, h4, h4 * { line-height: 1.5 !important; } h1, h1 *, h2, h2 * { color: rgb(41, 105, 176) !important; } h3, h3 *, h4, h4 * { color: rgb(184, 49, 47) !important; }

 <div class="wrapper"> <h1>Dyspepsi</h1> <h2><span style="color: rgb(0,0,0);">Dyspepsi</span></h2> <h1><strong><em><span style="color: rgb(0,0,0); line-height:2.5">Dyspepsi</span></em></strong></h1> <h2><strong><em><span style="color: rgb(0,0,0);">Dyspepsi</span></em></strong></h2> <h3><strong><span style="color: rgb(0,0,0); border-bottom: 1px solid;">Dyspepsi</span></strong></h3> <h4><strong><em><span style="color: rgb(0,0,0);">Dyspepsi</span></em></strong></h4> </div>