display: flex内での改行

Question

前提・実現したいこと

display: flex内で改行させたいのですが、<br>文字は改行できるのですが、
<button></button>などは改行して表示されません
改行させる方法をご存じの方いらっしゃいますでしょうか？

該当のソースコード

<label style="width:100%;height:10%;display: flex;justify-content: center;align-items: center">hello1<br>hello2<br>hello3<br><button>test</button></label>

Answer 1

flex-direction: column; を追加すればいいでしょう。

<label style="width:100%;height:10%;display: flex;justify-content: center;align-items: center; flex-direction: column;">hello1<br>hello2<br>hello3<button>test</button></label>