flexbox demo

#demo-area {

display: flex;

justify-content: {{ justifyContent.value }};

align-items: {{ alignItems.value }};

flex-direction: {{ flexDirection.value }};

flex-wrap: {{ flexWrap.value }};

align-content: {{ alignContent.value }};

}

Justify-Content

Align Items horizontally

align-items

Align Items vertically

flex-direction

Defines direction the items are placed in container

flex-wrap

Defines direction the items are placed in container