ragen Sie sich, warum dasitemContainer undpriceContainer wird nicht nebeneinander angezeigt?

Muss ich irgendeine Art von Datei für die FlexBox einbinden?

Ich dachte, es wurde in CSS3 eingebaut. Gibt es ein Standard-Add-On, das verwendet werden kann?

.container {
  display: flex;
  display: -webkit-flex;
  width: 100%;
  height: 100%;
  flex-direction: row;
}
#orderContainer {
  width: 15%;
  border: 1px solid #f2f2f2;
  height: 100%;
  flex-direction: row;
}
#selectionsContainer {
  width: 85%;
}
#catagoryContainer {
  width: 100%;
  height: calc(20% - 2px);
  border: 1px solid #f2f2f2;
}
#menuContainer {
  width: 100%;
  height: 80%;
  border-top: 0px;
  border: 1px solid #f2f2f2;
}
#itemContainer {
  width: 70%;
  height: 80%;
  border: 1px solid #f2f2f2;
  display: flex;
  order: 1;
}
#priceContainer {
  width: calc(30% - 2px);
  height: 80%;
  border: 1px solid #f2f2f2;
  display: flex;
  order: 2;
}

<div class="container">
  <div id="orderContainer">
    <div id="itemContainer">
      itemContainer
    </div>
    <div id="priceContainer">
      priceContainer
    </div>
  </div>

  <div id="selectionsContainer">
    <section id="catagoryContainer">
      catagoryContainer
    </section>
    <section id="menuContainer">
      menuContainer
    </section>
  </div>
</div>