css - 如何水平居中表格中的所有内容

Question

所以在我的渲染函数中，我有

 render() {
     <div>
        <form id="one">
          <TextField id="t1" ... />
          <Button id="b1" />
        </form>

        <div id="empty"><div/>

        <form id="two">
          <TextField id="t2" ... />
          <TextField id="t3" ... />
          <Button id="b2" />
        </form>

     </div>
  }

我正在尝试将所有内容水平居中。表格之间的“空”div 是为了在表格之间创建空间。

我该怎么做？

谢谢!

Answer 1

尝试使用 React bootstrap 中的 Grid 系统，在 Row 和 Col 的帮助下，您可以更好地控制水平和垂直显示控件。这是更多信息的链接。 https://react-bootstrap.netlify.com/layout/grid/#grid