Slideshow images fit to desktop but not to mobile

Store Design

Topic summary

A user reported that slideshow images below the main menu display correctly on desktop but fail to fit properly on mobile devices.

Solution Provided:

  • Add CSS code to the end of the base.css file
  • The code uses a media query targeting screens up to 767px width
  • Sets aspect-ratio: auto !important for hero container images and SVGs

Outcome:

  • The CSS fix successfully resolved the mobile display issue
  • The problem is now closed
Summarized with AI on October 29. AI used: claude-sonnet-4-5-20250929.
1

Hi

With the slideshow images below the main menu, they fit to desktop ok but not to mobile. Can anyone advice please?

URL Wholesalers UK | Leigh Shop

Thanks

2

Please paste this code in the end of base.css file.

@media (max-width: 767px) {
    .hero-container .bg-container img, .hero-container .bg-container svg {
        aspect-ratio: auto !important;
    }
}
3

perfect thanks

4

I am happy that I would fix the issue.

If you need more help fee l free to ask me.

Thanks