[Support request] Typography plugin settings does not honor css specificity.

[Olle]

Hi
If I use the customizer to add some styles to headings. h2 for example.
Then it’s totally impossible to edit that h2 with a higher specificity. line-height is what is the problem.
So I had to drag all the settings to 0 to be able to edit my other styles.

So I do some styles for h2 in the customizer like font-size 36px, line-height 1.2em.
Then I want to have another style for a specific div. So I set up a CSS rule like div h2.special-div and edit the styles to for example font-size 24px, line-height 0.9em.
It does not have any effect at all.

So what is the trouble here?

Regards
Olle

[David]

Hi there,

what does the HTML you’re using look like? For example if you’re targeting a H2 in a div then something like this:

<div class="special-div">
    <h2>My heading in a special div</h2>
</div>

and the CSS would look like this:

.special-div > h2 {
    /* My styles here */
}

or alternatively this:

<h2 class="special-heading">My special heading</h2>

and CSS:

h2.special-heading {
    /* My styles here */
}

[Author]

Posts