Woocommerce Products not aligned

0
votes

Can anyone help me with the below screenshot. All my products are all over the webpage and they are not aligned

I have tried to regenerate thumbnails and this does not solve my problem. I have set dimensions and added new images, that doesn't work I have tried turning off remote amazon images, and that didn't work.

Any ideas? Screenshot

2
wordpresswoocommerce
please set the product image height and width @Joe and please share your live product link - Savan Dholu

2 Answers

1
votes

Use flexbox and align product items flex-end which will position the items at the bottom of the container and specifying a min-height value for the header tags because some names might span over 2 or more rows.

ul.products {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}

ul.products li.product a h3 {
  min-height: 40px;
}
0
votes

They are aligned. Only when the div is larger than... The whole layout looks weird.

Try changing the min-height of the div what holds the product.

There might be a better solution, but it hasn't come up in me yet