mhpreiman
2/12/2018 - 2:00 AM

center vertically

center vertically.md
content_copyfile_download
  • Rendered
  • Source

center vertically exactly in middle:

element {
  position: relative;   /*or absolute*/
  top: 50%;
  transform: translateY(-50%);
  /*check for margin too*/
}

or:

parentElement {
  display: flex;
  align-items: center;
  height: 100%;     /*cbse*/
}

or:

parentElement {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;     /*cbse*/
}