/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 vote412 views1 answer
Import global variables scss angular
CSS
0 vote373 views1 answer
Scss select all childs
CSS
0 vote354 views1 answer
Css check if class as color white
CSS
0 vote344 views3 answers
Howto stop the screen from zooming in when I click on input tag on mible
CSS
-1 vote390 views1 answer
Materialize table padding css
CSS Materialize
0 vote362 views4 answers
Width in css
CSS
0 vote324 views1 answer
Css ol align center
CSS
0 vote370 views1 answer
CSS menu list with underline hover animation
CSS
68 votes347 views5 answers
Jquery css
CSS
0 vote383 views1 answer
Restore mariadb from bz2 file cli
CSS