Вложение медиа-запросов ⇐ CSS

[Anonymous]

По умолчанию я хочу придать элементу тела зеленую рамку. На устройстве, поддерживающем дисплей Retina, я хочу сначала проверить размер. На iPad я хочу придать своему телу красную рамку, а на iPhone — синюю рамку. Но такое вложение медиа-запросов не работает:

body { border: 1px solid green; }

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
@media (max-width: 768px) and (min-width: 320px) {
body { border: 1px solid red; }
}
@media (max-width: 320px) {
body { border: 1px solid blue; }
}
}


Подробнее здесь: https://stackoverflow.com/questions/161 ... ia-queries