Question

Estoy empezando un diseño desde cero de una web, en la que tengo un div contenedor con una anchura del 80% y centrado, dentro de este tengo varios divs separados por imagenes (en forma de barra) esta barra quiero que ocupe la mitad de la pagina en pc, y en moviles quiero que ocupe la pantalla entera, pero por alguna razón, mi movil ignora los media query, cada vez que cambio el css para pc se efectúan los cambios en la web del movil y en el pc tambien, pero si cambio las querys, el movil las ignora.

Aqui os dejo mi css:

div.contenedor{
    width: 90%;
    height: 400px;
    margin: 0 auto;
    border: 1px solid;
}

#cabecera{
    width: 100%;
    height: 400px;
    border: 1px solid;
}

.separador{
    width: 487px;
}

/* ----------------------------- MEDIA QUERY ---------------------*/
@media only screen and (max-width: 900px) {
    .separador{
        width: 50%;
    }
}

@media only screen and (max-width: 500px) {
    .separador{
        width: 50%;
    }
}
@media only screen and (max-width: 360px){
    .separador{
        width: 50%;
    }
}

He probado con varias anchuras y nada... Gracias de antemano por la ayuda.

Saludos

Comments

Podrías editar la pregunta y agregar el HTML con el contenedor y los separadores?
O mejor aún, poner esa parte del HTML y el CSS en algún sitio en el que se pueda ver funcionando?
Pareciera que las imágenes te están jugando una mala pasada, o que te falta agregar un elemento más al media-query para que se comporte como querés...