Quando si lavora con le query multimediali CSS, non sono sicuro che dovrei programmare in uno stile mobile-first o in uno stile desktop-first.
Ad esempio, diciamo che mi viene assegnato un design costituito da un insieme di blocchi che sono affiancati. Sul desktop, seguirò le specifiche, ma su dispositivi mobili, data l'area dello schermo ridotta, due blocchi impilati uno sopra l'altro sarebbe meglio.
Che è meglio, questo (prima sul desktop):
div {
width: 50%;
display: inline-block;
}
@media all and (max-width: 600px) {
width: 100%;
margin: 0 auto;
display: block;
}
o questo (prima il cellulare)?
div {
width: 100%;
margin: 0 auto;
display: block;
}
@media all and (min-width: 600px) {
width: 50%;
display: inline-block;
}
L' tema più recente di Wordpress segue il metodo mobile-first, utilizzando min-width
, ma sono corretto assumendo che i vecchi browser senza supporto di media query non sarebbero in grado di analizzare queste direttive e caricare il css "mobile"?
Quali sono i vantaggi / gli svantaggi di entrambi?