/CSS/How to center horizontally and vertically block div

How to center horizontally and vertically block div

Center div horizontally and vertically

.parent {
  position: relative;
}
.child {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

Source: codepen.io

Vertical and horizontal align center div

.center {
  height: 200px;
  position: relative;
  border: 3px solid green;
}

.center p {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

Similar codes

0 vote202 views1 answer
Center text html css position fixed
CSS
0 vote351 views1 answer
Width cross browser
CSS
0 vote209 views1 answer
Chrome remove black inline from click button
CSS
0 vote253 views1 answer
How to truncate a multiline text using css
CSS
0 vote193 views1 answer
Losange css
CSS
31 votes241 views6 answers
Overflow
CSS
14 votes230 views2 answers
How to render css in flask
CSS
2 votes219 views1 answer
Css square image
CSS
28 votes227 views3 answers
Text gradient css3
CSS
0 vote200 views1 answer
Dad
CSS