Estou tentando utilizar media queries no meu aplicativo desenvolvido com o Cordova, porem ele não esta funcionando, o código é o seguinte:
#backgroundIndex{
@media screen and(max-width: 1200px){
background: red;
}
@media screen and(max-width: 740px){
background: url('../img/background.jpg') repeat top left;
}
}
O que eu gostaria de fazer é: Quando a resolução for menor que 740px o background use uma imagem. No caso de ser maior, o background seria vermelho.
Quando estou desenvolvendo sites utilizo estes mesmos comandos porém no mobile não esta funcionando, mesmo definindo o viewport
:
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
Está dando um erro no inspec:
The key "target-densitydpi" is not supported.
Como posso resolver isto?
max-device-width
ao invés demax-width
?max-device-width