如何将两个组件放置在最左侧和最右侧并在反应中内联？答案

【问题标题】：How do I postion both component on the far left and right and inline in react?如何将两个组件放置在最左侧和最右侧并在反应中内联？
【发布时间】：2020-04-15 15:13:47
【问题描述】：

如何将两个组件放置在最左边和最右边并内联反应？创建按钮不能内联和向右。

<div className="card-header">
    <div className="col-6">
        <h5>Products Category</h5>
    </div>
    <div className="btn-popup col-6 pull-right">
        <button type="button" className="btn btn-primary" onClick={this.onOpenModal} data-toggle="modal" data-original-title="test" data-target="#exampleModal">Create</button>
        <Modal open={open} onClose={this.onCloseModal} >
            <AddDiscount/>
        </Modal>
    </div>
</div>

【问题讨论】：

你试过text-right而不是pull-right吗？

标签： javascript css reactjs

【解决方案1】：

我只是通过添加一行来修复它

<div className="card-header">
  <div className="row">
    <div className="col-6">
      <h5>Discount</h5>
    </div>
    <div className=" btn-popup col-6 text-right">
      <button type="button" className="btn btn-primary" onClick={this.onOpenModal} data-toggle="modal" data-original-title="test" data-target="#exampleModal">Create</button>
    <Modal open={open} onClose={this.onCloseModal} >
      <AddDiscount/>
    </Modal>
  </div>
  </div>
</div>

【讨论】：