I need to adjust my slideshow banner to fit on Tablet screens

Topic summary

Slideshow banner images display correctly on desktop and mobile, but on iPad/tablet (especially portrait) they appear overly zoomed and crop key content.

Initial setup used the MONO theme. Advice suggests experimenting with different image aspect ratios (width-to-height, e.g., 1300x600 vs 1200x400 or 1600x500) to find a workable compromise, and using themes that support separate desktop and mobile images. Theme demos can be installed to test these settings before purchase.

After trying this, the poster purchased a theme with separate desktop and mobile images. Desktop and phone now look correct, but tablets still zoom/crop the banner, cutting off significant content.

The poster asks for a CSS (styling code) technique to force banners to fit tablet screens.

No concrete fix or code has been provided yet; the discussion remains open with a specific request for tablet-targeted CSS guidance.

Summarized with AI on January 13. AI used: gpt-5.

Try experimenting with images of different aspect ratios, to see if you can find a ‘sweet spot’ where you’re happy with the sizing on each of your devices.

Ex. if you’re using an image that’s 1300x600, then try maybe 1200x400 or 1600x500.

Play around with the image sizes until you find a size that works best for how you want things to look. With that said, it can sometimes be hard to find an image size that works perfectly for all device types.

Most premium themes do have an option to upload a secondary ‘mobile’ image though (it’s usually right below where you upload the image for desktop). Having 2 versions of the images (landscape for desktops, and portrait for mobile) can help with this. If your theme doesn’t have this functionality built in, you can always try switching themes to one that does. You can test themes before purchasing by adding the demo to your store, and then exploring the settings built into it via the theme editor.