Product Images are being cutoff on mobile (dawn theme)

[ypcollective]

As seen in the images, the full picture is not displaying as it should on mobile (cut off from the bottom) and id like this to be fixed. The second image (on pc) loads properly. TIAAbout Dreams Paris - YPCollective – Young Professionals Collective

[BSS-TekLabs]

Hi @ypcollective,

Here are the steps you can follow:

1, Navigate to Online Store > Themes > Edit Code.

2, Locate and open the base.css (or theme.css, custom.css) file.

3, Paste the code snippet provided below at the bottom of the file, then save your changes.

.product-card-wrapper .card__media .media {
    overflow: visible;
}

Here is the result

We hope this assists in resolving the issue.

If you find our solution helpful, kindly consider Liking and Marking it as Accepted. Thank you!

[niraj_patel · Accepted solution]

Hello @ypcollective 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (max-width: 767px) {
.product-grid-container .card__media .media {
overflow: visible !important;
}
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.