reactjs - ReactJS 定位组件

Question

抱歉，如果这是一个愚蠢的问题，我将在长时间的中断后返回代码，并且在尝试整理投资组合等时不得不重新学习很多基础知识。

在 ReactJS 中，有没有一种方法可以在不使用材料 ui 或引导程序的情况下水平并排对齐组件？

这就是我想要创造的： -

  ----------------------------
  |                 |        |
  |   component 1   |  comp  |
  |-----------------|    3   |
  |                 |        |
  |  component 2    |        |
  ----------------------------

组件 3 下降到其他两个下方，如何对齐组件，没有网格系统是否可能？

编辑：如果使用材料 ui 更好，你能解释一下我如何将组件 3 放置在 2 行上吗

标签： reactjsmaterial-uicomponentsalignment

Answer 1

解决这个问题的最好方法是使用 CSS Flexbox。例如，您可以拥有具有属性的主容器flex-direction: row;，其内部将包含两个元素：一个具有属性flex-direction: column;保存组件 1,2 的容器和另一个独立元素，它将是组件 3。