The radio group is always vertical listed in material-ui. Is there a way to horizontally align them? e.g. all radio button in one horizontal line.
To make a horizontal radio button set, add the data-type="horizontal" to the fieldset . The framework will float the labels so they sit side-by-side on a line, hide the radio button icons and only round the left and right edges of the group.
Simply use the row
property:
<RadioGroup row><Radio /><Radio /></RadioGroup>
RadioGroup
inherits from FormGroup
so the properties of the FormGroup
component are also available.
Another example, with labels:
<RadioGroup aria-label="anonymous" name="anonymous" value={false} row> <FormControlLabel value="true" control={<Radio />} label="Yes" /> <FormControlLabel value="false" control={<Radio />} label="No" /> </RadioGroup>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With