Image resizing on home page (product category) [closed]

The CSS of WooCommerce is stretching the images to 100% of their parent <div>, as seen here:

 ul.products li.product a img {
     -moz-transition: all 0.2s ease-in-out 0s;
     box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
     display: block;
     height: auto;
     margin: 0 0 8px;
     **width: 100%;**
 }

You can simply remove or override that line using the !important declaration in another CSS file. Also, you can override it to width: auto and change the margin: 0 0 8px in that rule set to margin: 0 auto 8px auto to center those images in their div container.