How can I ensure that the “Add to Cart” button remains aligned properly on the shop page, even when the product names vary in length? I attempted to implement this CSS code, but it only seems to work when hovering over the button.
.woocommerce .products .product .button {
font-size: 13px;
/* padding:8px 26px; */
margin-left: 10px;
position: absolute !important;
display: block;
bottom: 30px;
vertical-align: bottom !important;
}
.woocommerce a.added_to_cart {
/* display: inline-block; */
font-size: 12px;
line-height: 18px;
padding-top: 8px;
position: absolute !important;
display: block;
bottom: 30px;
vertical-align: bottom !important;
white-space: nowrap;
border-bottom: 1px solid transparent;
}