ReactJS水平对齐Material-UI元素 [英] ReactJS align material-ui elements horizontally

问题描述

我正在尝试在文本输入旁边添加一个单选按钮，以便用户从本质上可以为问题输入答案"并标记为首选.但是，Material-UI会将它们放在自己的行上.

I am trying to have a radio button next to a text input so essentially a user can input "answers" to a question and mark one preferred. However, Material-UI puts each on it's own line.

这是我目前拥有的:

<div>
   <RadioButton
      value="light"
   />
   <TextInput
       hintText="Answer"
       multiLine = {true}
   />
</div>

推荐答案

仅作记录，我设法使用 flexboxgrid ...做了这样的事情:

Just for the record, I managed to align radio buttons using flexboxgrid... Did something like this:

      <div className="row">
        <div className="col-md-2">
          Type:
        </div>
        <div className="col-md-10">
          <RadioButtonGroup
             className="row"
             name="type">
            <RadioButton
               className="col-md-4"
               value="other"
               label="Other" />
            <RadioButton
               className="col-md-4"
               value="custom"
               label="Custom" />
          </RadioButtonGroup>
        </div>
      </div>

这篇关于ReactJS水平对齐Material-UI元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！