Resizing images to fit mobile view

[caleeji]

so my featured collection photos on my homepage of my website looks great on desktop and fits perfectly but when i go to view it on mobile view, it cuts out the whole image and it does not give me and option to resize it to fit so you can see the whole image on mobile view please help. This is my website to view it.

https://lumoxe.com/

Thank you CJ

[WinkyApps · Accepted solution]

Hi @caleeji 

Welcome to Shopify community and thanks for posting this question. 

Please use this below code at the bottom of your Settings > Online Store > Themes > Action > Edit Code

In the Assets folder look for theme.scss.liquid. Add this below code at the bottom of the file.

@media only screen and (max-width: 749px) {
    .collection_grid-item {
        background-size: contain;
        background-repeat: no-repeat;
        padding-top: 100%;
    }
}

Try and let me know if that works. Hope this helps.

[caleeji]

THANK YOU SO MUCH!! that worked