3 ways to Center a Div

Sk - Jul 7 '21 - - Dev Community
  1. Using the Grid

.CenterDiv {
      display: grid;
      place-items: center;
}
Enter fullscreen mode Exit fullscreen mode
  1. Using flex
.CenterDiv {
display: flex;
justify-content:center;
align-items: center;
}
Enter fullscreen mode Exit fullscreen mode
  1. place content
.CenterDiv {
  display: grid;
  height: 100vh;
  place-content: center;
}
Enter fullscreen mode Exit fullscreen mode
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .