javascript - 内联React-Toolbox复选框

我目前在尝试像这样内联显示它们时，react-toolbox-checkboxes https://github.com/react-toolbox/react-toolbox/tree/dev/components/checkbox遇到问题：



但是我所能做的就是像这样显示它们：



代码如下：

           <Checkbox
                checked={this.state.checkboxes[0].task}
                label={t('search:instance_template.task')}
                onChange={() => {
                    this.handleCheckboxChange(0, 'task')
                }}
            />

样式如下：

input[type="checkbox"]{
    display: inline-block;
}

复选框确实接收了类和属性，但是诸如“ display：inline-block”之类的属性对它们没有任何影响。有任何想法吗？谢谢！

最佳答案

[阅读目的]也链接两个页面，这将有助于每种样式的工作方式。 Flexbox，CSSFlexbox

与问题有关的样本。