Tutorial: Quick Tip: Spacing Between Radio Button Options

When creating a radio button question, usually the label or text of each option is very short and only takes up a single line. However, if you have larger descriptions for each radio button option, you can have multiple lines of text related to a single radio button.

Sometimes you would want to manually force more spacing between all of your radio buttons, regardless of the number of lines. Be aware, this fix effects all radio button questions equally. However, this can be accomplished with a simple adjustment to the Look & Feel section of your survey.

Making changes to Look & Feel

• Scroll down to the large box titled This Theme’s CSS Template
• You will find add the following code to the bottom of the box:

  .sg_Radio_Options input {margin: 30px 0;}

• You can alter the spacing by changing the 30px value:

  .sg_Radio_Options input {margin: 25px 0;}

• Click Save Your Customizations

That’s it! If you wanted to align the buttons to the top of the text rather than the middle, consider checking out the Quick Tip: Alignment of Radio Button Options.

If you have any further questions, feel free to check out our forums and contribute to the community!