Aligning Flex Elements to Parent with Padding in CSS
The space-around value in the justify-content property sets the first and last flex items to be spaced from the edge of their parent.
At first glance it may seem that the distance between elements and between the outermost elements and the parent will be equal, however, this is not so - the distance between elements will be 2 times greater than between the parent and the outermost element.
Let's look at an example:
.parent {
display: flex;
justify-content: space-around;
}
Result of code execution:
