funzionamento media queries

[lorenzo84]

Salve a tutti, sto cercando da giorni di capire il funzionamento di questo strumento. Se io devo impostare le dimensioni per gli smartphone come posso fare? o meglio, devo usare il max-width o il min-width? se io scrivo:

@media screen and (min-width: 768px) {
#contenutodanascondere{display:none}
}
in questo caso al di sotto di quella risoluzione visualizza il div ma sopra no. la domanda è questa:
qual'è la soluzione migliore per far si che negli smartphone appaiono contenuti diversi da quelli che appaiono a risoluzioni maggiori?
una cosa così?
@media screen and (min-width: 768px) and (max-width: 768px){
#contenutodanascondere{display:none}
}


grazie a tutti

[Experiment8]

Dovresti settare sia larghezza che altezza, esempio:

- @media screen and (max-width: 768px) and (max-height: 480px) and (orientation: landscape)
{
CSS
}

- @media screen and (max-width: 768px) and (max-height: 480px) and (orientation: portrait) {
CSS
}

Le misure sono a caso dovresti mettere quelle del dispositivo e l'orientation funziona per ipad ma non garantisco su altri dispositivi

[lorenzo84]

ma non esiste un modo per prendere più dispositivi possibili senza fare dimensione per dimensione? se io volessi solo l'orientamento verticale?

[ratte]

Ciao Lorenzo! o/

Ahhh... hmmmm... ehhhh... complicato.... 8)
Comunque, una bella scorciatoia, per ora potrebbe essere utilizzare:

@media screen and (max-device-width : 768px) {
...
}

per cui puoi fare riferimento alla larghezza massima disponibile sul dispositivo, non alla larghezza della finestra.

o/ !