Increase the spacing in radio button.

I have a section with radio buttons, 5 choices.  I'd like them to me spread in one row.  If I select 5 columns in preferences they are spaced very close together.  I've seen similar questions that recommended inserting the following CSS code: 

.form-multiple-column .form-radio-item {

width: 200px !important;

}

When I tried that it stacked the choices vertically rather than horizontally in 5 columns.  I tied 100 as well.

Any suggestions?

To resolve the issue, please select 5 columns in the preferences again. Then inject the custom css below to add more space to each radio button.

li#id_50 {

    width: 100%!important;

}

div#cid_50 {

    max-width: 700px!important;

}

Make sure that label align is set to top to display the row correctly.

The column should now look like the image below.

If you need further assistance, please let us know.