[Support request] CSS for paragraph text that is large, and responsive

Home Forums Support CSS for paragraph text that is large, and responsive

  • This topic has 1 reply, 2 voices, and was last updated 1 year ago by Leo.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #1009521
    Joseph

    Let’s say I want something that is in a large font, say 48px, for desktop. Don’t want to use a heading because it’s unimportant text (SEO wise). But I want it to be responsive, so 28x on mobile, for example. I can copy CSS and manipulate it to how I need it, but not good at creating it out of thin air.

    I’ve seen prior posts about @media but how do I create a special class or selector so I can use this throughout the site?

    #1009529
    Leo
    Staff
    Customer Support

    Hi there,

    You can do this for the HTML:
    <p class="large-font">Some text</p>

    Then this would be the CSS:

    p.large-font {
        font-size: 48px;
    }
    @media (max-width: 768px) {
        p.large-font {
            font-size: 28px;
        }
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    Let me know if this helps 🙂

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