Why does my product picture appear smaller on the page?

[Question_lady]

I have uploaded product picture in jpg under 2048x2048px, it's a clear photo.

However, I only want to show a smaller product photo when not clicked zoom, another side about description page can be bigger but smaller words, how can I make it?

[GemPages]

Hello @Question_lady 

To provide you with the most precise solution in this case, could you please share your page URL ( with pass if your store password is enabled )?

Thank you and hope to hear from you.
Best regards,
GemPages Support Team

[Question_lady]

Hi GemPages Support Team,

Thanks for attention of my post, as follow:

https://magical-natural.com/

pw: payske

[zaczee]

Hi @Question_lady ,

Add this CSS code
Online Store > Themes > Edit code > Assets > custom.css or theme.css

.grid__item.product__media-wrapper { max-width: 35% !important; width: 35% !important; }
.product__info-wrapper.grid__item { max-width: 65% !important; width: 65% !important; }

[Question_lady]

I've tried below 2 but don't any changes on mobile or computer.

.grid__item.product__media-wrapper { max-width: 10% !important; width: 90% !important; }
.product__info-wrapper.grid__item { max-width: 10% !important; width: 90% !important; }

@media only screen and (min-width: 750px) {
.grid__item.product__media-wrapper { max-width: 10% !important; width: 90% !important; }
.product__info-wrapper.grid__item { max-width: 10% !important; width: 90% !important; }
}