[Resolved] Align "Add to Cart" button WooCommerce

Hi Joel,

simple fix is to always display a maximum of 2 lines in the title whether there is 2 lines or not. This forces all content to be the same size and makes all fields align including the button. Heres my CSS:

/* Force 2 line title inclusve */
.woocommerce ul.products li.product h2 {
  line-height: 2.5ex;
  height: 5ex; /* 2.5ex for each visible line */
  overflow: hidden;
}

Thanks Tom, glad i could be of assistance. Idea came from a solution i used back in my days of printing……

Hi there,

thanks for sharing – we have just made some major improvements to Woo in the upcoming GP Premium 1.8 that should alleviate some alignment issues. If you want to test it out you can download the Release Candidate from your Accounts > Downloads. Be good to hear how your plugin works on that version.

Nice – thanks for sharing. I’ll make sure Tom gets to see it 🙂

Hi there,

Woo loves to change classes – give this a shot:

.woocommerce ul.products li.product .woocommerce-LoopProduct-link h2 {
    line-height: 2.5ex;
    height: 5ex; /* 2.5ex for each visible line */
    overflow: hidden;
}