banner image mobile

  • If I wish to remove the banner image, only on mobile devices/small screens, but keep the menu. Is there a snippet of code I can use in my custom css child theme?

    Was thinking it might be something like this.

    @media only screen and (min-device-width : 320px) and (max-device-width : 480px) {

    #header { display: none }

    }

    However, that removes the menu as well.

    Cheers,

    Bobby

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

  • Hi Bobby,

    You can try adding the following code to your Admin Panel > Appearance > Customize > Advanced Options > Additional CSS field:

    @media screen and (max-width: 659px) {
  #header {
  background: none;
}
}

    Thanks!

    Thread Starter autonomyscotland

    (@autonomyscotland)

    Hi,

    Thanks for that,

    That definitely removes the image on mobile screens. Although, the container is still there appearing as a black box. It looks ok but I would prefer if it wasn’t there at all.

    Maybe, if the box can’t be removed, it’s possible to reduce the size of the box where the image should be, by altering its height?

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘banner image mobile’ is closed to new replies.