Почему мой CSS медиа-запрос игнорируется?

Я пытаюсь заставить этот кусок CSS работать на моем ipad, но он, кажется, игнорирует медиа-запрос и использует стандартную обертку CSS вместо него. есть ли способ остановить это?

@media only screen and (max-width: 1024px) and (max-height: 768px) {
    #wrapper {
        position:absolute; 
        z-index:1;
        top:41px;
        width:150px;
        height:300px;
    }    
}

#wrapper {
    position:absolute; 
    z-index:1;
    top:41px; 
    bottom:0px; 
    left:0;
    width:100%;
    height:800px;
    overflow:auto;
}