Adjusting Font sizes for mobile screens
Hello,
I have large custom headings all over my website but instead of them getting smaller when viewed on mobile the words drop down and the words get cut off on small screens. I have tried adding a class to each header that will instruct them to shrink but this doesn't work. Is there are way to even Can anyone help me?
I have tried to add bigtitle as a class in the custom header options, then adding the below css.
@media only screen and (max-width: 700px) {
.bigtitle { font-size: 30px; }
}
All of my revolutions sliders are set to auto responsive so they do this automatically, is there a way to do this to just my custom headers?
Any help is appreciated.
Cheers
Jade
I have large custom headings all over my website but instead of them getting smaller when viewed on mobile the words drop down and the words get cut off on small screens. I have tried adding a class to each header that will instruct them to shrink but this doesn't work. Is there are way to even Can anyone help me?
I have tried to add bigtitle as a class in the custom header options, then adding the below css.
@media only screen and (max-width: 700px) {
.bigtitle { font-size: 30px; }
}
All of my revolutions sliders are set to auto responsive so they do this automatically, is there a way to do this to just my custom headers?
Any help is appreciated.
Cheers
Jade
Comments
we have such option included already. It's called Decrease Fonts and is under Theme options > Responsive section.
It's still not working for my big custom headers.
Could you take a look at my website to see if it's possible to see what I have done wrong?
http://103.37.8.109/~walkerhi/coaching/
http://103.37.8.109/~walkerhi/tax/
No problems if not I will try and work something out. Thank you for your quick response.
Cheers
Jade