Alignment for product variation swatches

Hello Ashley I,

Thanks for reaching out to us. If you put the below CSS here- Appearance > Customize > Additional CSS

.woocommerce div.product form.cart .variations tr {
   display: flex;
   flex-direction: column;
}

.woocommerce div.product form.cart .variations td.value,
.woocommerce div.product form.cart .variations td.label {
   display: flex;
   justify-content: center;
}

You will get it like this. Let me know if you wanted something like this.

Thanks

Hello Ashley,

Here is the final solution. Replace the previous code with the below code-

.woocommerce div.product form.cart .variations tr {
   display: flex;
   flex-direction: column;
}

.woocommerce div.product form.cart .variations td.value,
.woocommerce div.product form.cart .variations td.label {
   display: flex;
   justify-content: center;
}

.woocommerce div.product form.cart .reset_variations {
   position: relative;
   margin: auto -26px auto 26px;
}

If it works for you and found my support helpful, my humble request to you to write a beautiful thought here-

https://wordpress.org/support/plugin/woo-variation-swatches/reviews/?filter=5

Your rating keeps us inspired.

Thank You