Несмотря на мой поиск в Google, я нашел несколько примеров того, как реализовать многострочные флексбоксы. Ни один код, который я получил из примеров, не работал. У меня есть три элемента внутри flexbox, и я хочу, чтобы первый находился сверху, а второй и третий - в нижнем ряду.

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

Я пытался использовать эти свойства:

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

#element1 {
  width: 100%;
}

и придание ему заданной ширины, но оно все равно не будет перенесено, даже если первый элемент имеет ширину 100%. Я пропускаю определенные префиксы поставщика или мой синтаксис неверен?