[Support request] different font sizes for different screens

[anabella]

Hello! I want to set different font sizes for different screens, and I was able to do it for headings (through appearance > customize > typography), but I couldn´t find this option for paragraphs. Basically I want the font size for paragraphs to be 18px for desktop, 17px for tablets and 16px for mobile.
Thanks in advance

[David]

Hi there,

some CSS like this:

@media (max-width: 767px) {
    /* CSS in here for mobile only */
    body {
        font-size: 16px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    /* CSS in here for tablet only */
    body {
        font-size: 17px;
    }
}

[anabella]

Thanks David, it´s working great for mobiles, but for tablets I´m still getting 16px instead of 17px

[David]

I tweaked the code above down 1px on both 🙂

[anabella]

Thanks a lot David!! 🙂 All good now

[David]

Awesome – glad to be of help

[Author]

Posts