How can I align the radio buttons with their label?

[JoanaVL]

Hi, I have searched for this question here, but none of the solved posts helped with my problem.

How can I align the radio buttons with their labels on a form? It currently looks like this:

This is the first time I'm using radio buttons on a form.

I'm not a programmer but I know my way around html and css, and I can't get this to work, help me please!

[Sarah_K]

hi! i'm having this issue to. I can't find where to go into the CSS to update this. If I go to the style sheets or templates, it takes me to all of them, not to this specific page/setting. Can anyone advise how to get into the form CSS to update? 

[CMoore42]

I have the same question as you Sarah_K!

[JasonRosa]

Hey @JoanaVL would you be able to send a link to the page that you're working on so that I can get a better look at the code? 

[JoanaVL]

Sure, here it is https://campanhas.ciben.pt/formacao-reciclagem-v10-primavera.

[JasonRosa · Accepted solution]

Hey @JoanaVL awesome thank you! It looks like this is currently happening because of this style: 

body form.hs-form fieldset[class*="form-columns"] .hs-input {
    width: 100%;
}

which is setting all items with .hs-input to have a width of 100% (including the radio select buttons and checkbox buttons). I'd recommend keeping what you have above and adding the following so that your radio select buttons and checkbox buttons are styled properly: 

body form.hs-form fieldset[class*="form-columns"] input[type="radio"].hs-input,
body form.hs-form fieldset[class*="form-columns"] input[type="checkbox"].hs-input {
    width: auto;
}

[JoanaVL]

Ah it worked! Thank you for the quick reply!