Hi
How to I change the text size for H3, H2 tags on mobile devices without changing the font size on desktop?
I would also like to change the font size of the related posts titles on mobile only as they are too large on mobile but fine on desktop.
Thanks
Chris
Hi Chris,
At the moment there is no setting in the theme for it, but it can be done with custom css
For the titles, there are different css codes that apply, so you need to be more specific about them. Are they post titles on the homepage inside modules, or simple h2 and h3 tags inside the posts themselves.
I assume you are referring to the post titles on the homepage inside the blocks as this is a more common request:
For them you can use this code:
@media (max-width: 767px){
.td-module-title{
font-size:12px!important;
}}
The code will also affect the related articles.
Thank you!
Hi there thanks for reply
Actually I am referring to section headings within articles. Many of my articles are long, in excess of 1000 words so they get broken up with section headings which use H2, H3 and H4 at various points within the article content body.
They look perfect on desktop but slightly too large on iphone etc.
The related post titles fall into same situation.
Much obliged
Chris
Hi,
For the headings inside the post content, you can use this code:
@media(max-width:767px){
.td-post-content h2{
font-size:14px!important;
}
.td-post-content h3{
font-size:14px!important;
}
.td-post-content h4{
font-size:14px!important;
}}
Thanks.
