How can I center text and limit variations on Dawn Theme radio buttons?

Store Design
, ,
1

Screenshot 2023-05-15 154726.png
Screenshot 2023-05-15 154726.png1696×692 90.9 KB

hi! i was wondering if anyone knew how to do these two things

  • center ‘matte’ and ‘clear’ text on the buttons

  • limit 7 variations per row (first row ends at rose)

i’ve looked at previous posts, but can’t find a code that works.

thank you so much!

www.planandstick.co

2

Center ‘matte’ and ‘clear’ text on the buttons: Find the CSS selector for the buttons that contain the ‘matte’ and ‘clear’ text. It could be a class or an ID assigned to those buttons. Once you have the selector, apply the following CSS properties to center the text:

.your-button-selector {
  text-align: center;
}

  1. Replace .your-button-selector with the actual selector for your buttons.

  2. Limit 7 variations per row: To limit the variations to 7 per row, you can use CSS flexbox or grid layout. Here’s an example using flexbox:

.product-variants-container {
  display: flex;
  flex-wrap: wrap;
}

.product-variant-item {
  width: calc(100% / 7); /* Adjust the number to change the number of variations per row */
}