[Resolved] Larger cover page letters on laptop but not on mobile

Home Forums Support Larger cover page letters on laptop but not on mobile

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1486497
    Ben

    Hi, I wonder if you can help me – I may have missed a button to do this – perhaps you can point me in the right direction.

    I want to have larger text on my cover page images on a laptop but not on a mobile.

    How do I do this? Here is my home page. http://www.keepsafestorage.co.uk/

    See how the word “Domes” – (which is in Red to show up for the moment) – I can see how to make it bigger but by doing this it becomes too big on mobile.

    Is there a way to do this? Thanks

    #1486559
    David
    Staff
    Customer Support

    Hi there,

    try adding this CSS – it applies to wherever the large ( huge ) font size is selected:

    @media(max-width: 768px) {
        .wp-block-cover .has-huge-font-size {
            font-size: 24px;
        }
    }
    #1488227
    Ben

    Thanks for this. However – I may not have been clear – I want the cover page text to be much bigger – Like this – (which used custom size) http://www.keepsafestorage.co.uk/ See “Domes” on the top of the home page in red.
    I wanted this to be smaller on mobiles. I have tried changing the CSS – Changing the word huge to custom but I can’t get it to work.

    This is what I tried –


    @media
    (max-width: 768px) {
    .wp-block-cover .has-custom-font-size {
    font-size: 24px;
    }
    }
    Any ideas?

    Thanks

    #1488278
    David
    Staff
    Customer Support

    You can use the preset ( huge ) size that you’re using on the other cover blocks and add this CSS:

    /* Desktop size */
    .wp-block-cover .has-huge-font-size {
        font-size: 100px;
    }
    /* Mobile size */
    @media(max-width: 768px) {
        .wp-block-cover .has-huge-font-size {
            font-size: 40px;
        }
    }
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.