Center on page css

Center with css

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

Center div in middle of page

.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}

Source: css-tricks.com

Css center

// example 1 
div { display: grid; place-items: center; }

// example 3
div{ display:flex; align-items:center; }

// example 3
div { width: 100%; margin: 0 auto; }

Center on page css

body {
  display: grid;
  place-items: center;
  height: 100vh;
  margin: 0;
}

Similar codes

34 votes121 views2 answers
Box position in center css
CSS
4 votes128 views1 answer
How to stop an image repeating in css
CSS
4 votes114 views2 answers
How to make fonts respnsive
CSS
8 votes136 views2 answers
Text that shows an underline on hover
CSS
0 vote130 views1 answer
Centos 8 cron on reboot
CSS
0 vote141 views1 answer
Details summary hide arrow
CSS
0 vote124 views1 answer
Flexbox stretch
CSS
7 votes153 views6 answers
Background overlay css
CSS
2 votes124 views1 answer
Css class selector contains
CSS
8 votes131 views5 answers
Flex margin between items
CSS