GRID

.grid-container{
Justify-items: stretch; /*center | start | end*/
Align-items: stretch;/*center | start | end*/
justify-content: space-evenly; /*space-around | space-between | center | start | end | stretch*/
align-content: space-evenly; /* space-around | space-between | center | start | end | stretch*/
display: grid; /*inline-grid*/
grid-template-columns: auto auto 260px auto; /*1fr 3fr* | repeat(5, 1fr)/
grid-template-rows: 80px 200px;
grid-column-gap: 50px;
grid-row-gap: 50px;
grid-gap: 50px;
min-height: 100vh; /*Footer ფსკერზე, თუ სიმაღლე დაბალია*/
}


.item {
grid-area: 2 / 1 / span 2 / span 3;
justify-self: stretch; /*center | start | end | stretch*/
align-self: stretch; /*center | start | end | stretch*/
place-self: stretch; /*center | start | end | stretch*/
/*minmax ()*/
} justify-content
space-evenly
space-around
space-between
center
start
end
stretch

align-content
space-evenly
space-around
space-between
center
start
end
stretch

FLEX

.flex-container {
display: flex;
flex-direction: column; /*row*/
flex-wrap: wrap; /*nowrap | wrap-reverse*/
Align-items: stretch;/*center | start | end*/
justify-content: space-evenly;/*space-around | space-between | center | start | end | stretch*/
align-content: space-evenly; /*space-around | space-between | center | start | end | stretch*/
}

.flex-container div {
order: 1; /*| 2 | 3 | 4 | .... n - for each div must be set, :nth-child(n) can be used if class is not defined */
flex-grow: 1; /*| n - like fr in grid for each or single*/
flex-shrink: 0; /*n - 0 means nonshrinkable div*/
flex-basis: 200px; /*maxlength of div*/
flex: 0 0 200px; /*shorthand property for the flex-grow, flex-shrink, and flex-basis properties.*/
}

Perfect Center Settings

.flex-container {
display: flex;
Align-items: center;
justify-content: center;
}