Typography - Inherit Issue

Hello - my typography is set to inherit for many of my headlines, however it is not pulling the correct font type in. Help :slight_smile:

Hi Samantha,

Thank you for writing in, please add this to Theme Options > CSS

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: Baskerville,"Baskerville old face","Hoefler Text",Garamond,"Times New Roman",serif !important;
}

In that case, the headline is also a text and it has a stronger selector than the generic headline selector so it overwrites the Baskerville (headline), and apply Lato (body text) instead. That custom CSS above it to make sure the Baskerville (headline) is not overwritten.

Hope it helps,
Cheers!

Can you provide what the code would be if I broke it down into different fonts for each type of headline?

Hey Samantha,

It should be:

h1, .h1 {
font-family: Baskerville,"Baskerville old face","Hoefler Text",Garamond,"Times New Roman",serif !important;
}
h2, .h2 {
font-family: Baskerville,"Baskerville old face","Hoefler Text",Garamond,"Times New Roman",serif !important;
}
h3, .h3 {
font-family: Baskerville,"Baskerville old face","Hoefler Text",Garamond,"Times New Roman",serif !important;
}
h4, .h4 {
font-family: Baskerville,"Baskerville old face","Hoefler Text",Garamond,"Times New Roman",serif !important;
}
h5, .h5 {
font-family: Baskerville,"Baskerville old face","Hoefler Text",Garamond,"Times New Roman",serif !important;
}
h6, .h6 {
font-family: Baskerville,"Baskerville old face","Hoefler Text",Garamond,"Times New Roman",serif !important;
}

You may change the font-family attribute in each CSS block.

Hope this helps.

Like this?

h1, .h1 {font-family: Baskerville, !important;

}

Hi Samantha,

Yes, you will have to change the font family set for each block accordingly.

If you wanna understand how to write CSS codes, please check here:

Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.