[Resolved] Hide Cover Block on a Mobile Device

Home Forums Support [Resolved] Hide Cover Block on a Mobile Device

Home Forums Support Hide Cover Block on a Mobile Device

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1266953
    Megan

    Hi!

    I’m using WordPress block editor, and currently have a container setup of Group > Cover > Media & Text. So a cover block within a group block, and then a media & text block within the cover. The result of this is that my media & text is backed by a cover image on desktop, but this looks shocking on mobile. I’m trying to disable just the cover image element from showing on mobile.

    I’ve attempted to add CSS to the Advanced box for Additional CSS Class(es) for the cover block, but sadly this hasn’t worked. I’ve tried adding both “#content-mobile {display: none;}” and I also tried this:


    @media
    (max-width:629px) {
    img#optionalstuff {
    display: none;
    }
    }

    Neither of these did the trick.

    Any possible trick to succeed in this?

    Thanks!

    #1267289
    David
    Staff
    Customer Support

    Hi there,

    try adding this CSS:

    @media (max-width: 768px) {
        .no-mobile-background {
            background-image: none !important;
        }
    }

    then add no-mobile-background to the Additional CSS class on the Cover Block

    #1268335
    Megan

    Did the trick! Thankyou 🙂

    #1268545
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.