Archived topic

Hide Background/Cover image on mobile

7 replies · Started by EDWARD on March 9, 2020

Viewing posts 1–8 of 8

March 9, 2020 at 11:44 am #1190017

Hi, I'm trying to hide the background/cover images on my site. I added the below to the simple css but it does not seem to work.

<div class="hide-on-mobile hide-on-tablet">
    Content here will only display in Desktop
</div>

The site is in draft mode but here is a published page:

Any input?

Thanks!

Kevin

March 9, 2020 at 12:34 pm #1190051

Hi there,

Can you disable the AMP plugin for now and any other caching plugins you might be using?

Let me know :)

March 9, 2020 at 12:58 pm #1190072

Done

March 9, 2020 at 1:31 pm #1190094

Weird. I'm still seeing a bunch of AMP code involved:
https://www.screencast.com/t/wuZhb56sBp

Could you double check?

March 9, 2020 at 1:32 pm #1190096

Apologies, I had no me left on..it’s deactivated.

March 9, 2020 at 1:36 pm #1190099

It's a bit tricky as the background image is added as inline HTML style.

Give this CSS a shot:

@media (max-width: 768px) {
    .wp-block-cover.has-background-dim.ab-layout-landing-3-cover {
        background-image: none !important;
    }
}

March 9, 2020 at 2:59 pm #1190161

That worked! Thanks for the prompt response as always!

March 9, 2020 at 4:16 pm #1190190

No problem :)

This archived topic is closed to new replies.