Preguntándome por quéitemContainer ypriceContainer no se mostrarán uno al lado del otro?

¿Debo incluir algún tipo de archivo para FlexBox?

Pensé que estaba integrado en CSS3. ¿Hay un complemento estándar para utilizar?

.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>