CSS: Centering

By Xah Lee. Date: . Last updated: .

Center Horizontally

AM THE CENTER
.center885 {
 margin-left: auto;
 margin-right: auto;
 text-align: center;
 border: dotted 4px red;
}

Center Horizontally when position fixed

div.x {
 position: fixed;
 top: 2px;
 left: 50%;
 transform: translateX(-50%);
 border: solid 1px grey;
}

Center Vertically

Center of the Universe 
.center708 {
 height: 200px;
 width: 400px;
 display: flex;
 align-items: center;
 justify-content: center;
 border: dotted 4px red;
}