对于我的生活，我不能让这个flex行工作，它总是结束在一个列中，我已经剥离了这一切的基础，它似乎仍然不工作。我认为所有的flex属性都是从父继承的，所以我不明白我错在哪里。

/* Header Video Full Screen */

  /* Header Video Full Screen Table/Word Box*/

  /* Product Recommendations Box*/

.productFlexParent{
  display: flex;
  flex-direction: row;
  justify-content: center;
  max-width: 100%;
}

.productFlexChild{
  width: 30%;
}

.productFlexImage{
max-width: 100%;
}

<div>
  <!-- Header Video/Photo of Product -->
  <video>
    <source>
  </video>

  <!-- Computer Title Header and Configure Box if applicable -->
  <div>
  </div>
</div>
<div>
  <!-- 3D Rotator/Glam Video-->
</div>
<div>
  <!--Why buy from Auspec-->
</div>
<div>
  <!-- Bottom of page recommended specs/with toggle?-->

  <!-- Rounded Toggle switch -->
  <label class="switch">
    <input type="checkbox">
    <span class="slider round"></span>
  </label>

  <!--3 different models of build-->
  <div class="productFlexParent">
    <div class="productFlexChild">
      <img class="productFlexImage" src="https://umbrellacreative.com.au/wp-content/uploads/2020/01/hide-the-pain-harold-why-you-should-not-use-stock-photos-1024x683.jpg" alt="">
    </div> </div> <div class="productFlexParent">
    <div class="productFlexChild">
      <img class="productFlexImage" src="https://umbrellacreative.com.au/wp-content/uploads/2020/01/hide-the-pain-harold-why-you-should-not-use-stock-photos-1024x683.jpg" alt="">
    </div> </div> <div class="productFlexParent">
    <div class="productFlexChild">
      <img class="productFlexImage" src="https://umbrellacreative.com.au/wp-content/uploads/2020/01/hide-the-pain-harold-why-you-should-not-use-stock-photos-1024x683.jpg" alt="">
    </div> </div> 
  </div>