Div centering methods

Select a method, see the result in the preview, then copy the CSS code with one click.

The most used and flexible solution. Aligns in both row and column directions.

Preview`.parent` inside `.child`

Centered div

CSS code

/* Container */
.parent {
  display: flex;
  align-items: center;   /* vertical */
  justify-content: center; /* horizontal */
}

/* Child */
.child {
  /* your content */
}