flex block reponsive code example
Example: flex block reponsive
/* big screen */
.navigation {
display: flex;
flex-flow: row wrap;
/* Aligne les items à end line sur main-axis */
justify-content: flex-end;
}
/* medium screen */
@media all and (max-width: 800px) {
.navigation {
/* on centre en répartissant l'espace entre les items */
justify-content: space-around;
}
}
/* little screen */
@media all and (max-width: 500px) {
.navigation {
/* On n'utilise plus row mais column */
flex-direction: column;
}
}