stabilire dimensioni per mobile

[chucky831]

Con media query sto impostando la grafica del mio sito per mobile. Dato che non l'ho mai utilizzato volevo sapere meglio come funziona. Per ora l'ho settato in modo che possa funzionare su iphone 4 e 5 e cosi funziona. Se volessi settarlo per pc che dimensioni devo usare? perchè per iphone ho usato questo: @media screen and (max-device-width: 360px) ma se aumento il valore max si vedrà su tutti gli altri dispositivi fino a quando la grandezza non raggiunge il valore max. Come posso fare?

[Nobody33]

Codice per visualizzare il tuo sito per qualunque dispositivo, sia in verticale che in orizzontale (ti aggiungo anche la media per la stampa):

@media (min-width: 1200px) {
/*stile*/
}

@media (min-width: 768px) and (max-width: 979px) {
/*stile*/
}
@media (max-width: 767px) {
/*stile*/
}
@media (max-width: 480px) {
/*stile*/
}
@media (max-width: 360px) {
/*stile*/
}

@media print {/*stile per la stampa*/}

ovviamente puoi aggiungere qualunque altra risoluzione, a seconda dei tuoi bisogni. In linea generale però, il codice di cui sopra va benissimo per tutti, perché un cell. è sempre girabile in orizzontale.

Per IE8 conviene fare un foglio di stile a parte.