React：以不同的方式渲染组件

时间：2018-03-31 06:26:18

标签： javascript html twitter-bootstrap reactjs

我有两个组件，它们应按以下方式显示： - enter image description here

现在问题陈述是，我必须首先渲染组件B＆amp;然后是组件A.但是组件A应该显示在左边，而B显示在右边。 可以使用任何CSS或引导来显示/排列组件。

  

注意：组件A返回矩形，组件B返回圆/椭圆。

1 个答案:

答案 0 :(得分：4)

纯css解决方案：您可以使用display: grid;和order: 1;以及order: 2;重新排列顺序。
我快速codepen进行演示。

或者如果你不允许使用容器 - 这可能很简单：只需给予组件B负边距左边和组件A正边距左边。 https://codepen.io/anon/pen/LddwYa

相关问题
最新问题