pokaż/ukryj div na podstawie rozmiaru przeglądarki za pomocą TYLKO css?

Question

Próbuję uzyskać elementy div do pokazania/ukrycia w zależności od rozmiaru przeglądarki, używając tylko zapytań o media css ... ale nic nie działa poprawnie ... proszę o pomoc, jeśli możesz i daj mi znać, co robię źle ... z góry dziękuję!

herezje mój css ..

@media all and (max-width: 959px) { 

    .content .700{display:block;} 
    .content .490{display:none;} 
    .content .290{display:none;} 

} 

@media all and (max-width: 720px) { 

    .content .700{display:none;} 
    .content .490{display:block;} 
    .content .290{display:none;} 

} 

@media all and (max-width: 479px) { 

    .content .700{display:none;} 
    .content .490{display:none;} 
    .content .290{display:block;} 

} 

i oto moja html

<div class="content"> 
    <div class="700">this is the content for desktop</div> 
    <div class="490">this is the content for tablet</div> 
    <div class="290">this is the content for mobile</div> 
</div> 

Answer 1

nazwa klasy nie może zaczynać się od cyfry. zmień go na np. X700, X490, X290 i powinno działać

Answer 2

class name cant być liczbą i cant rozpocząć z numerem w css, tutaj zmieniło nazwę klasy jego dobrą pracę

http://jsfiddle.net/RtTsy/