FROM CACHE - en_header

How to style Shopify variants?

New Member
1 0 1

I'm adding 5 variants to one of my products and it looks ugly by default when viewed on the site.

How do I style the variants using CSS to make a box around the variant section of the product page and left align the variants maybe so they don't look scattered randomly in that area of the product page?

I am an experienced developer and just need to be pointed in the right direction if someone knows?

Reply 1 (1)
Shopify Partner
24 1 4

If you want to create a box around the variants section, you can use the CSS property "border." For example:


.variants {


border: 1px solid #000;




If you want to left-align the variants, you can use the CSS property "text-align." For example:


.variants {


text-align: left;