A pesar de mi Google, he encontrado algunos ejemplos sobre cómo implementar flexboxes de varias líneas. Ninguno de los códigos que obtuve de ejemplos ha funcionado. Tengo tres elementos dentro de un flexbox y quiero que el primero esté en la parte superior y el segundo y el tercero en la fila inferior.

<div class="flexbox">
  <div id="element1">element 1</div>
  <div id="element2">element 2</div>
  <div id="element3">element 3</div>
</div>

He intentado usar estas propiedades:

.flexbox {
  width: 300px;
  display: box;
  display: -webkit-box;
  display: -moz-box;
  box-lines: multiple;
  flex-wrap: wrap;
}

#element1 {
  width: 100%;
}

y le da un ancho establecido pero aún no se ajusta, incluso si el primer elemento tiene un ancho del 100%. ¿Me faltan algunos prefijos de proveedores o mi sintaxis es incorrecta?