I do a catalog using Bootstrap 3. When displayed on tablets, the product images look ugly because of their small size (500x500) and a width of 767 pixels in the browser. I w
You can use property of d-block here or you can use a parent div with property 'text-center' in bootstrap or 'text-align: center' in css.
Image by default is displayed as inline-block, you need to display it as block in order to center it with .mx-auto. This can be done with built-in .d-block:
Or leave it as inline-block and wrapped it in a div with .text-center: