luqin / react-icheck

:radio_button: iCheck components built with React. Highly customizable checkbox, radio buttons and radio group.
https://luqin.github.io/react-icheck
177 stars 40 forks source link

Radio buttons inline #47

Open gilnetoglartek opened 6 years ago

gilnetoglartek commented 6 years ago

I'm having an issue where I have a RadioGroup with two Radio objects inside. They appear like so: image

I need them to appear vertically, like so: image This was achieved by editing the label element inside the browser.

Where can I edit these settings specifically? This is the DOM structure in runtime: image

Thanks

iamkhush commented 6 years ago

Use <div className="clearfix"></div> between the radio buttons.

gilnetoglartek commented 6 years ago

It worked. Thanks.

ojha007 commented 3 years ago

How to add <div className="clearfix"></div> to display vertically ` <RadioGroup name={props.input_name} value={props.defaultValue}

{ props.options && props.options.map((value, key) => ( <Radio style={{ display: 'block' }} id={value} key={key} radioClass="iradio_square-blue" increaseArea="20%" type="radio" label={ <span style={{padding: '1em'}}> { value.charAt(0).toUpperCase() + value.substring(1) } } value={value} onClick={props.handleChange} /> ) )

                }`