center div using flex

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

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;

1section {
2  width: 200px;
3  border: 1px solid #2d2d2d;
4  display: flex;
5  justify-content: center;
6}

1.table-wrapper {
2  display: flex;
3  flex-direction: column;
4  padding: 2rem;
5  margin: 0 auto;
6}

1<div class="container">
2  <div class="item"></div>
3</div>
4
5div.container {
6  background: gray;
7  width: 80px;
8  height: 80px;
9  display: flex;
10  justify-content: center;
11  align-items: center;
12}
13
14div.item {
15  background: silver;
16  width: 30px;
17  height: 30px;
18}