[Resolved] Responsive Title

[Sourabh]

HI,

for a post, I have default font size for H2 heading is 25 and for H3 is 20, How should I make it small for a mobile device like I don’t get any option for the mobile device here??

I want to make H2-20px and H3-18px for a mobile device, how to do it??

also make sure it’s for posts only, not for the entire website…

[Elvin]

Hi there,

You’ll need custom CSS to make it only apply on single posts page only.

try this CSS:

@media(max-width:768px){
body.single h2{
font-size: 20px;
}
body.single h3{
font-size: 18px;
}
}

[Sourabh]

after applying CSS, when I check the mobile version so seems it’s not working for H2, i have tried reducing it more to font sizes 10, 12 but in the mobile version, H2 is still the same, no change however it’s working for h3…

what to do ??

[Elvin]

It won’t work on h2 elements from headline blocks that have custom set font size in them.

Consider removing the these set font size or try overriding that setting with the use of !important:

Example:

@media(max-width:768px){
body.single h2{
font-size: 20px !important;
}
body.single h3{
font-size: 18px !important;
}
}

[Sourabh]

ok thanku..!

[Elvin]

No problem. 😀

[Author]

Posts