Custom Heading Font Size decrease on mobile devices

shanepfc · November 2014

Hi

I would like to be able to decrease the font size of my custom headings from a resolution below 768px width. The reason for this is that when the heading stays the same font size it completely overpowers the mobile screen and becomes as bad viewiing experience. Please see pic of headings on mobile screen.

http://snag.gy/Gd8SN.jpg

Thanks Shane

Albert · November 2014

Hi,

to decrease heading font on mobile devices, you must play with similar code as we gave you last time but with different declaration:

@media only screen and (max-width: 768px) { 
    h2 { font-size: 16px !important; }
    h3 { font-size: 14px !important; }
    h4 { font-size: 12px !important; }
}

shanepfc · November 2014

Many thanks

Shane

Custom Heading Font Size decrease on mobile devices

Comments