Different size image on Desktop versus Mobile- Dawn Theme

Different size image on Desktop versus Mobile- Dawn Theme

FrostBC
New Member
6 0 0

Hi, I want my home page image to show up smaller (or cropped preferably) on Desktop. It’s optimized for a mobile device so in Desktop it’s too long. How can I do that?

 

 

 

Replies 3 (3)

Dan-From-Ryviu
Shopify Partner
9232 1852 1886

Hi @FrostBC 

Please share your store link to check

- Helpful? Like and Accept solution!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

FrostBC
New Member
6 0 0
23a298.myshopify.com

Password is “FrostBC”
Dan-From-Ryviu
Shopify Partner
9232 1852 1886

You can try to add this CSS code to Custom CSS of that section in theme customize 

@media screen and (min-width: 750px) {
.banner { max-height: 500px }
.media>img { object-fit: contain; !important; }
.banner__media { background: #fff; }
}

Screenshot 2023-10-20 at 10.12.29.png 

- Helpful? Like and Accept solution!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.