Оберните изгибаемые элементы в сетку из 2 столбцов

Я пытаюсь сделать 2-колоночную сетку с flexbox, но она не дает желаемого результата. Вместо этого он производит 3 столбца в строке. Вот моя разметка и CSS:

#product_variants {
  display: flex;
}
#product_variants .product_addtocart_variant {
  padding: 10px;
}
#product_variants .product_addtocart_variant .box-tocart .variant-info {
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}
#product_variants .product_addtocart_variant .box-tocart .variant-container {
  display: inline-flex;
}
#product_variants .product_addtocart_variant .box-tocart .variant-container .variant-price {
  font-weight: bold;
}
#product_variants .product_addtocart_variant .box-tocart .variant-container .quantity input {
  width: 52px;
  height: 52px;
  text-align: center;
  border: 3px solid #002855 !important;
}
#product_variants .product_addtocart_variant .box-tocart .actions button {
  background-color: transparent;
  border: 3px solid #ef7c00;
  color: #ef7c00;
  height: 52px;
}
<div id="product_variants">
  <form class="product_addtocart_variant" novalidate="novalidate">
    <div class="box-tocart">
      <div class="variant-info">
        <strong>322123-100 Exemplare</strong>
        <span>Artikelnummer: 322123-100 Exemplare</span>
      </div>
      <div class="fieldset">
        <div class="variant-container">
          <div class="variant-price">
            <span>Brutto: 432.0000</span>
            <span>Netto: </span>
          </div>
          <div class="quantity">
            <div class="control">
              <input type="number" name="qty" class="qty" maxlength="12" value="1" title="Anzahl" data-validate="{&quot;required-number&quot;:true,&quot;validate-item-quantity&quot;:{&quot;minAllowed&quot;:1}}">
            </div>
          </div>
          <div class="actions">
            <button type="submit" title="Zum Warenkorb hinzufügen" class="action primary tocart">
              <span>Zum Warenkorb hinzufügen</span>
            </button>
          </div>
        </div>
      </div>
    </div>
  </form>
  <form class="product_addtocart_variant" novalidate="novalidate">
    <div class="box-tocart">
      <div class="variant-info">
        <strong>322123-50 Exemplare</strong>
        <span>Artikelnummer: 322123-50 Exemplare</span>
      </div>
      <div class="fieldset">
        <div class="variant-container">
          <div class="variant-price">
            <span>Brutto: 232.0000</span>
            <span>Netto: </span>
          </div>
          <div class="quantity">
            <div class="control">
              <input type="number" name="qty" class="qty" maxlength="12" value="1" title="Anzahl" data-validate="{&quot;required-number&quot;:true,&quot;validate-item-quantity&quot;:{&quot;minAllowed&quot;:1}}">
            </div>
          </div>
          <div class="actions">
            <button type="submit" title="Zum Warenkorb hinzufügen" class="action primary tocart">
              <span>Zum Warenkorb hinzufügen</span>
            </button>
          </div>
        </div>
      </div>
    </div>
  </form>
  <form class="product_addtocart_variant" novalidate="novalidate">
    <div class="box-tocart">
      <div class="variant-info">
        <strong>322123-10 Exemplare</strong>
        <span>Artikelnummer: 322123-10 Exemplare</span>
      </div>
      <div class="fieldset">
        <div class="variant-container">
          <div class="variant-price">
            <span>Brutto: 132.0000</span>
            <span>Netto: </span>
          </div>
          <div class="quantity">
            <div class="control">
              <input type="number" name="qty" class="qty" maxlength="12" value="1" title="Anzahl" data-validate="{&quot;required-number&quot;:true,&quot;validate-item-quantity&quot;:{&quot;minAllowed&quot;:1}}">
            </div>
          </div>
          <div class="actions">
            <button type="submit" title="Zum Warenkorb hinzufügen" class="action primary tocart">
              <span>Zum Warenkorb hinzufügen</span>
            </button>
          </div>
        </div>
      </div>
    </div>
  </form>
</div>

здесь у меня есть мойпример менее

Ответы на вопрос(1)

Ваш ответ на вопрос