Am I centered yet?
    
Center me,please!

、
， ：

 main {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-top: -3em;
            margin-left: -9em;
            width: 18em;
            height: 6em;
       }

calc ， ：

main {
            position: absolute;
            top: calc(50% - 3em);
            left: calc(50% - 9em);
            width: 18em;
            height: 6em;
      }

， 。 ， CSS （ margin） ， 。
， CSS 。 translate() ， ， 。

main {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }

、
margin 。

 main {
            width: 18em;
            padding: 1em 0.5em;
            margin: 50% auto 0;
            transform: translateY(-50%);
        }

CSS ， 。
1、vw 。 ，1vw 1%， 100%。
2、 vw ，1vh 1%。
3、 ，1vmin 1vw， 1vh。
4、 ，1vmax 1vw， 1vh。

main {
            width: 18em;
            padding: 1em 1.5em;
            margin: 50vh auto 0;
            transform: translateY(-50%);
        }

、 Flexbox

body {
            display: flex;
            min-height: 100vh;
            margin: 0;
        }

        main {
            margin: auto;
        }

Flexbox ， （ ） 。 ， ：

Center me，please!

main ， Flexbox align-items justify-content ，

 main {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 18em;
            height: 10em;
        }