Media Query snippet for quick recall
Posted on July 5, 2020
I've always check in previous projects the proper way to write a Media Query for mobile-first project.
I can't memorize it, don't know why.
So, here the snippet, a rule that apply by default (mobile-first) and the media query that override for tablet/desktop viewport:
.wrapper{
display: flex;
flex-direction: column;
}
@media screen and (min-width:420px) {
.wrapper{
flex-direction: row;
}
}