Ways to organize checkboxes

I am trying to organize my input checkboxes into a table format that is 3 X 6. I tried doing this:

And it sort of worked. But now when I try to edit it and adjust things like the padding and margin, it doesn’t work very well. I feel like there’s a better way to do this but I’m not sure what.

I have this image set as the background image of the checkbox container element (id="type-options):

And I want the checkboxes to line up with the different types. That’s all lol

If anyone has any ideas on what I can do, I would greatly appreciate it! Thanks!


I would look into using a CSS grid for this, myself. I think that would help with the manipulations you are trying to perform.

Also, +1 for Pokemon. :slight_smile:

1 Like

Thank you so much! This seems to be working better, I haven’t gotten it 100% lined up but it’s closer than before. Just a little more tweaking and it should be fine. :slight_smile:

1 Like