水平に積み重ねられたフレックスアイテムから垂直に積み重ねられたフレックスアイテムへの移動方法は？

Question

次のコード水平フレックスアイテムをスタック：

.col-12 { 
 
    display: flex 
 
} 
 

 
input { 
 
    flex: 0 0 80% 
 
} 
 

 
label { 
 
    flex: 0 0 20% 
 
}

<div class="col-12"> 
 
    <label>Label</label> 
 
    <input type="text" value=""></input> 
 
</div>

私はMessageので、何を変更する必要がありますが、入力フィールドの上にありますか？ （そして、入力フィールドには、容器全体を埋める？）

Answer 1

HTML

<div class="col-12"> 
    <label>Label</label> 
    <br> 
    <input type="text" value=""></input> 
</div> 

CSS

.col-12 { 
    display: flex 
    flex-direction: column 
}