Organize Forminator checkboxes into columns

Hi everyone, i want to change the layout of my checkbox’s answers from a single column to 3 columns using CSS

https://drive.google.com/file/d/1gTY8cuYHCRywKeql0zAjdrWqIRtrRhVM/view?usp=sharing

i tried this code using ChatGPT

https://drive.google.com/file/d/1d5eH_p4X2qe8gs3NuVGTBAhaM72S6BTD/view?usp=sharing

div[role="group"] > label.forminator-checkbox {
 display: inline-block; /* This allows us to specify a   width for each label / 
 width: 32%; / Approximately a third of the container width, adjust as needed / 
 margin-right: 2%; / Space between columns, adjust as needed / 
 box-sizing: border-box; / Include padding and border in the element's total width / } 

div[role="group"] > label.forminator-checkbox:nth-of-type(3n) { 
 margin-right: 0; / Prevents adding margin to the right of the last element in each row */
}

but this is how it turned out!

• This topic was modified 11 months, 1 week ago by yousramttk.
• This topic was modified 11 months, 1 week ago by yousramttk.