Itqualityassurance
Radio buttons should always be aligned vertically so that the radio dial is aligned and labels are also aligned. In the event that a horizontal option is necessary, make sure that the radio button is aligned together, with the top of the label align horizontally as well, in the event the labels wrap.
- Should radio buttons be vertical or horizontal?
- Can radio buttons be horizontal?
- Should radio buttons be stacked?
Should radio buttons be vertical or horizontal?
Vertical positioning of radio buttons is safer. Try to lay out your lists vertically, with one choice per line. If you still need a horizontal layout with multiple options per line, make sure to space the buttons and labels so that it's absolutely clear which choice goes with which label.
Can radio buttons be horizontal?
By default, checkboxes and radio buttons are displayed in vertical format. You can change the appearance to be horizontal instead using a Custom CSS Class. The default vertical display is recommended.
Should radio buttons be stacked?
Use radio buttons when the user can choose only one option out of a list. Use these for a small number of discrete elements—avoid long lists of radio buttons (usually no more than 6-8 options). When there are more than two options, stack radio buttons vertically.
