flex box로 수평수직 가운데 정렬하기

index.html

<style>
  html {
    height: 100vh;
  }

  body {
    height: 100%;
  }

  .flexbox-container {
    display: flex;
    height: 100%;
    justify-content: center;
    align-items: center;
  }

  .flexbox-item {
    background-color: #ddd;
  }
</style>

<div class="flexbox-container">
  <div class="flexbox-item">hello world!</div>
</div>

.flexbox-container {
  justify-content: center;
  align-items: center;
}

• flex box로 수평수직 가운데 정렬하기