[Resolved] CSS Styling Issue variantions

[nik9]

Hello,

I have a styling issue for mobile. How can I adjust (only on that product page) this to this for mobile only? => https://ibb.co/wg1cpSN

I tried with .variations {text-align-last: center;} but that does not work..

Cheers

[Ying]

Hi there,

Try this CSS:

.vi-wpvs-variation-wrap {
    justify-content: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
}

Let me know 🙂

[nik9]

Thanks!

Now I use this CSS:

But.. it does not work on iPhone.. safari & chrome tested. Do I have to use for that different options?

.vi-wpvs-variation-wrap {justify-content: center !important;}

.vi-wpvs-variation-style .vi-wpvs-variation-wrap-wrap {text-align-last: center;}

.woocommerce div.product form.cart .variations td.label {text-align-last: center;}

td.value.vi-wpvs-variation-style-content {text-align-last: center;}

[Ying]

Yea.. that’s browser support issue. Edited CSS here have a try:
https://generatepress.com/forums/topic/css-styling-issue-variantions/#post-1655105

[nik9]

perfect! thanks! 🙂

[Ying]

No problem 🙂

[Author]

Posts