Different hero image on mobile

  • Is it possible to have different hero images on different screen sizes ? My client has a banner where the focus of the image is on the right.

    When viewing on a mobile that part of the image is cut off so I would like to change the image and have the text over it.

    Thanks

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

  • Hi,

    It is impossible to use different hero images in the mobile view. However, you can use this custom CSS code in Appearance -> Customize -> Additional CSS to move the image to the right in the mobile view

    @media (max-width: 767px) {
  #hero img {
    left: unset !important;
    right: 0;
  }
}

    Regards.

    Thread Starter martyyn

    (@martyyn)

    Thank you.

    In the end I used different images and text positioning based on breakpoints to get around it.

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

Tags