Issue with images cutting off horizontally in Dawn theme on the homepage

Store Design
,
1

Can someone help me figure out how to get my images to display correctly on the homepage using Dawn theme? 2 image widths are not adjusting properly. I tried making all images the same size (but this puts a lot of space between images) and changing the CSS in both the overall theme setting and even just to the section with issues. Here are the 3 CSS changes I tried: 1) img {max-width: 100%; max-height: 100%;}, 2)img {object-fit: cover;}, 3) img {width: auto; max-height: 100%;}

The 3 CSS changes didn’t yield a different result - no change at all. Please help! http://www.healthjefe.com (scroll down to what makes us the most effective (below the product).

2

If you want the whole image to show up (not be cut off) you can add “object-fit: contain;” to it.

Note: “object-fit: cover;” scales the image to cover the whole parent div which can result in some part of the image being outside of it. and “object-fit: contain;” makes sure the whole image is visible even though some parts of the parent div may remain empty.

3

Thank you so very much that worked! Sincerely appreciate the response.

1 Like