    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="UTF-8">
      <title>flex 세로 레이아웃 만들기</title>
      <style>
        .container {
          display: flex;
          flex-direction: column;
        }
        .item {
          height: 10vh;
          background-color: #fea;
          border: 2px solid #cdf;
          border-radius: 3px;
          text-align: center;
          margin: 10px;
        }
      </style>
    </head>
    <body>
      <div class="container">
        <div class="item">1</div>
        <div class="item">2</div>
        <div class="item">3</div>
      </div>
    </body>
    </html>