Why are my product images too large in the Stiletto theme?

[keljo]

When I enter products and add images in Stiletto my photos look fine, but on the home page and product page they are too big.  I have searched for a solution and most involve editing code in section-main-product.css, but I cannot find that in the stiletto theme so I am hoping that someone can tell me how to edit the code in Stiletto.  

url is ellejboutique.com and password is ellejboutique

Thank you!

[theycallmemakka]

Hi @keljo 

If this is something you are looking for, you can follow below steps 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

<style>
.featured-collection-slider__product {
    max-width: 20%!important;
}
</style>

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
Makka

[keljo]

Unfortunately, it did not work.

[theycallmemakka]

Hi @keljo , can you try adding this. Also let me know which section section you are looking at.

<style>
.featured-collection-slider__product,
.recommended-products__slide{
    max-width: 20%!important;
}
@media only screen and (max-width: 600px) {
  .featured-collection-slider__product,
    .recommended-products__slide{
        max-width: 50%!important;
        width: 50%!important;
    }
}

@media (min-width: 960px){
   .product__primary-right {
        min-width: 500px!important;
    } 
}

</style>

[keljo]

Thank you for the quick response, unfortunately that did not work either.

[keljo]

The photos are to large in all the sections.  The featured collections is where it is most noticeable, but they are also to big when you click into a product.  They look fine when I upload the images on the add product page but once I am viewing the online store they are all to big.

[Raj-webdesigner]

Add This css In  Edite Code > Theme.css File 

.featured-collection-slider__product.carousel__slide.swiper-slide {
    max-width: 300px;
}

[keljo]

Thank you for your response, unfortunately, it did not fix the problem.

[Raj-webdesigner]

Can You Tell Me Which Type Problem You Face add This Css in Your Theme.css File.
OR

which Type Error Show in Website.