How do I change font-size for mobile?

Home Forums WordPress Themes – Premium Preference How do I change font-size for mobile?

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #15154
    Judy Asman
    Participant

    Hi, Andre,
    Will you please advise as to how I can change my h1 font sizes in the custom mobile CSS section? Would you happen to know a solution?

    I tried adding different styles to all of the mobile screen sizes you include but none of them worked. http://judyasman.com/judyasman_wp/

    The font I use will not show up in IE — just FF, Chrome and on my device. Either way, the text is overlapping when it wraps.

    Thank you!

    #19920
    Sushil Adhikari
    Moderator

    That would make for a good blog tutorial …. I made a note. However, to change the font sizes with media queries (responsive sizing), here is an example:

    @media (max-width: 480px) {
    	h1 {font-size: 14px; line-height: 1;}
    	h2 {font-size: 12px; line-height: 1;}
    }

    Usually a good idea to add a line-height as well, although it’s a personal preference how the line height is done, some will do it in a px value or em value. The media query will also depend on what screen size you are editing font sizes for as well. The example above means that any screen size from 0 to 480px (generally a landscape view on a phone), your font sizes will be what you see in the example.

    The above example can also be used for anything else you need to adjust at that screen size.

    #19924
    Judy Asman
    Participant

    Thanks, Andre! I agree with you about the blog tutorial. That would be so kind of you. Meanwhile, thanks for this solution and quick response. I will give this a try and let you know how it works!

    #15155
    Judy Asman
    Participant

    Thanks again, Andre! This worked for me. Very helpful 🙂

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.