Css 引导4列的灵活对齐

我完全糊涂了。我已经弄明白了这一点，然后刷新了JSFIDLE，不知怎的，解决方案发生了变化。我有一行，行中有两列。我无法使两列在同一行上对齐。我试着在周围使用justify内容，但它不起作用。我们将不胜感激

<div class="container-fluid">
  <div class="d-flex flex-row justify-content-around my-flex-container">
    <div class="d-flex flex-column my-flex-container-column">
      <div class="flex-row my-flex-container">Row 1</div>
      <div class="flex-row my-flex-container">Row 2</div>
      <div class="flex-row my-flex-container">Row 3</div>
      <div class="flex-row my-flex-container">Row 4</div>
    </div>  
    <div class="d-flex flex-column my-flex-container-column">
      <div class="d-flex flex-row my-flex-container">
        <div class="flex-column my-flex-container-column">
           <div class="flex-row my-flex-container">Row 1
           </div>
           <div class="flex-row my-flex-container">Row 2
           </div>
        </div>
      </div>
      <div class="d-flex flex-row flex-1 my-flex-container">
        <div class="my-auto">ROW 3</div>
      </div>

    </div>
  </div>
</div>

---

你需要将你的引导版本从Alpha升级到Beta版本，你可以得到它

.我的flex容器{ 边框：2倍纯绿； } .my flex容器列{ 边框：2倍纯绿； } .flex-1{ 弹性：1； } 一排 第2排 第3排 第4排 一排 第2排 第3排