css flex center

1display: flex;
2align-items: center;
3justify-content: center;

1/* Answer to: "css flex vertical align" */
2
3.box {
4  display: flex;
5  align-items: center; /* Vertical */
6  justify-content: center; /* Horizontal */
7}
8
9.box div {
10  width: 100px;
11  height: 100px;
12}
13
14/*
15  For more information go to:
16  https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Aligning_Items_in_a_Flex_Container
17*/

1.primary-nav {
2    display:-webkit-flex;
3    display:flex;
4    list-style-type:none;
5    padding:0;
6    justify-content:flex-end;
7}
8
9.left {
10    margin-right:auto;
11}

1/* HORIZONTAL */
2justify-content: center;
3
4/* VERTICAL */
5align-items: center;

1	display: flex;
2    width: 60%;
3    justify-content: center;
4    margin: 0 auto;

1align-items: flex-start | flex-end | center | baseline | stretch
2
3.container {
4  display: flex;
5  align-items: flex-start;
6}