Quick View image is not displaying correctly

Store Design
, , , , , ,
1

Hey. I found a problem on my site that needs to be fixed before the site launches, but I’m not able to figure it out on my own. When I go to the quick view of a product, the picture of the product itself spreads across the entire section. Could someone help me with the fix?
www.lumitica.com
beifri

Zrzut ekranu 2024-10-24 143603.png
Zrzut ekranu 2024-10-24 143603.png994×891 282 KB

2

hey @adrianovsky ,

first of all

Inspect the CSS

Adjust the CSS

.quick-view img {
    max-width: 100%; /* Ensures the image doesn't exceed the container's width */
    height: auto; /* Maintains aspect ratio */
    object-fit: contain; /* Ensures the image fits within the bounds without stretching */
}

Got it! If you found my suggestions helpful, please consider liking or marking it as a solution.
Your feedback is appreciated! If you have any more questions or need further assistance, just let me know.

regards

Akshay bhatt

3

I put it into style.scss but it doesn’t working.

4

hey @adrianovsky ,

give access of your website

5

I would prefer not to give any stranger access to the site.

6

I actualy do it on my own. This code helped me:
#product_quick_view img {
max-width: 400px;
width: 100%; /* This ensures the image scales down to fit the container if it’s smaller /
height: auto; / Keeps the aspect ratio */
}
.swiper-slide img {
max-height: 60px;
}