Need help with styling my survey form
Hello everyone, I’m in need of help with that survey form. I’m trying to put the labels in front of the radio buttons and the checkboxes, but I don’t know what to do.
I would appreciate any assistance.

The issue here is that the .form-group div has display set to flex and flex-direction set to column and thus all of the labels and inputs are stacking in one column. So you’ll need to figure out a way to work around that. I would recommend you treat each label/input combo as a single unit. What do you think you could add to do that?

Try putting input tags inside the label tags, something like this-
<label for="open-mat"> <input type="checkbox" id="open-mat" name="open-mat" value="open-mat">Open-mat</label>

I would need to redo the whole spacing/styling if I do that. Doable, I just thought I could do something by leaving the flex there. Thank you for your input!

Going to try that now, thanks

I don’t think it is as hard as you think it would be. I recommended that you treat each label/input combo as a single unit. This means changing the HTML a little. In particular, adding something that would allow the label/input to act as a single unit. Once you fix that then they won’t be affected by the flex display on the container.

1 Like