flex - the simple guide

just a brief intro of CSS3 flex. no deep shit ;)

credits to A Complete Guide to Flexbox
also git - the simple guide
by gaoryrt
please report issues on github

.container

every flex based on {display: flex}
set these attributes in flexd container
instead of flexd items

<justify-content>

alignment along the container
this WON'T make items diaplay horizontally
<justify-content>: flex-start | flex-end | center | space-between | space-around

<align-items>

flex items laying on the line
<align-items>: flex-start | flex-end | center | stretch | baseline

.item

set these attributes in flexd items
instead of flexd container

<align-self>

set this attribute between flexd items
instead of flexd container
<align-self>: auto | flex-start | flex-end | center | space-between | space-around
align-self: auto would follow .cotainer

comments