Wie implementiere ich eine mehrzeilige Flexbox?

Trotz meines Googelns habe ich nur wenige Beispiele für die Implementierung von mehrzeiligen Flexboxen gefunden. Keiner der Codes, die ich aus Beispielen erhalten habe, hat funktioniert. Ich habe drei Elemente in einer Flexbox und möchte, dass das erste oben und das zweite und dritte in der unteren Reihe liegen.

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

Ich habe versucht, diese Eigenschaften zu verwenden:

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

#element1 {
  width: 100%;
}

und geben Sie ihm eine festgelegte Breite, aber es wird trotzdem nicht umgebrochen, selbst wenn das erste Element eine Breite von 100% hat. Vermisse ich bestimmte Herstellerpräfixe oder ist meine Syntax falsch?

Antworten auf die Frage(2)

Ihre Antwort auf die Frage