Return to previous page

Product image height be constant - by Thinktech

This topic has 4 replies, 2 voices, and was last updated 4 years, 8 months ago ago by Olga Barlow

Thinktech

Participant

August 5, 2019 at 13:19

http://saibabamachines.com.cp-45.webhostbox.net/product/ex-308-turn-mill-center/
1.Height should be constant for all image in product details page
http://prntscr.com/ook2d0
2.when clicking on zoom in ,reduce the height by 10%;
http://prntscr.com/ook3o5

#218492 Copied Theme version: 5.0

3 Answers
Olga Barlow

Support staff

August 6, 2019 at 07:39
Hello,

1) If you limit the max-height of the image then you will get the white space before and next to the image, for example http://prntscr.com/oowj7k
If you just want to place the gallery slider at the top use the following code
```
.gallery_vertical .woocommerce-product-gallery {
    align-items: flex-start;
}
```
2) To limit the zoom window use
```
.mfp-figure figure img {
    max-height: calc(90vh - 50px) !important;
}
```
Regards
#218539 Copied
Thinktech

Participant

August 6, 2019 at 11:05

for zoomed in image now its looking good.
1.Height Should be in constant, since height is getting changed.kindly height of the image should take in fixed height.

#218566 Copied
Olga Barlow

Support staff

August 6, 2019 at 14:33
Hello,

Sorry but WooCommerce plugin does not have the option to limit single product image height and enable cropping for it. So you can use custom CSS to limit the height, for example
```
.woocommerce-product-gallery.images .owl-item img {
    max-height: 264px;
    width:auto;
    margin:0 auto;
}
```
or use all the images with the same height (edit images using graphic redactor before uploading them to your media library).

Regards
#218586 Copied
Viewing 4 results - 1 through 4 (of 4 total)