[Support request] Increase Header Font Size in Tablet Only

Home Forums Support Increase Header Font Size in Tablet Only

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #990498
    Ash

    Hello,

    Having looked through the support forum, I am unable to find a solution for this. I’m fully aware that it will be a simple task, but I can’t seem to grasp it.

    When I view my site in the customiser, the WordPress interface provides three options to view the site, desktop, tablet, mobile. However, when I customize it for the mobile width and then view it in table mode, the header font which I set for mobile is then too small when viewed on a tablet.

    I would appreciate any help on this.

    Thanks in advance.

    Ash

    #990585
    David
    Staff
    Customer Support

    Hi there,

    you can use this CSS to target the main title and description for tablet devices:

    @media (min-width: 769px) and (max-width: 1024px) {
        .main-title {
            font-size: 20px;
        }
        .site-description {
            font-size: 16px;
        }
    }
    #990609
    Ash

    David,

    Thanks for your response.

    It’s not the title or description that is the issue.
    It’s the header <h2>

    #990615
    David
    Staff
    Customer Support

    Then you would do this:

    @media (min-width: 769px) and (max-width: 1024px) {
        h2 {
            font-size: 20px !important;
        }
    }
    #990758
    Ash

    Thanks, David, but that doesn’t resolve the issue.
    I’ve altered the font size in the coding, yet nothing changes.

    #990764
    David
    Staff
    Customer Support

    Can you link me to the Site so i can see what the issue is?
    You can edit your original topic and use the Site URL to share the link privately.

    #990773
    Ash

    I’m unable to do that.
    I thought I explained the issue well in my initial post.

    When I view my site in the customiser, the WordPress interface provides three options to view the site, desktop, tablet, mobile.

    However, when I use the customizer to select the <h2> font size for the mobile width, that same setting displays the <h2> font size too small when viewing on a tablet.

    What I need is to be able to increase the <h2> font size when viewed on a tablet.

    I hope this is a little clearer.

    #990781
    David
    Staff
    Customer Support

    Yep, that is what that CSS does – i even tested it to make sure – if it is not working then something else is overriding that CSS. I have edited the CSS here to include !important try that.

    If that doesn’t work then it would be good to see the site. If not possible where are you adding the CSS?

    #990990
    Ash

    Thanks again David, but doesn’t seem to be working for me.
    I’m aware that it is a simple task, but it’s not making any difference.

    I don’t have any time left right now, but I will give you a shout tomorrow sometime.

    Thanks again

    Ash

    #991028
    David
    Staff
    Customer Support

    OK, let us know where you’re adding the CSS? And whether you have any other CSS in there.

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