problema con propiedad display:none en css

[paxarin]

Muy buenas.
Estoy adaptando una web a distintas resoluciones y todo va correcto hasta que para la resolución más pequeña 400px cree un menu de navegación distinto al del resto de las versiones.
En total tengo 3 hojas de css.
Lo logico es que en las 2 primeras ponga:
#responsive_nav{display:none}
que es el menu para la versión movil, y en la versión movil poner
#navigation{display:none}
y así deberia de funcionar, pero no es así y la verdad que no lo entiendo. Tambien probe con visibiliti:hidden pero el resultado es el mismo.
En definitiva que en el momento que pongo:
#responsive_nav{display:none}
no se muestra la navegación en la version movil. Alguien sabria decirme cual puede ser el problema?

[pzin]

Iniciado por paxarin

En definitiva que en el momento que pongo:
#responsive_nav{display:none}
no se muestra la navegación en la version movil. Alguien sabria decirme cual puede ser el problema?

¿Eing? ¿El problema es que algo funciona bien?

[paxarin]

Que tengo dos menos de navegación.
Uno para resoluciones de escritorio y tablet y otra para movil
La de escritorio y tablet se llama navigation y la de la version movil responsive_nav
de hay que en unas hojas ponga una que una sea visible o la otra no.
Y eso es lo que no funciona y no comprendo.

[pitufoweb]

Es que así como dices es normal que no se muestre, pues le tienes display:none;


Ademas creo que no lo estas haciendo "bien".

1.- Tendrías que ir de menos a mas. Es decir, primero para móvil y después para tablet y desktop.

2.- No creo que necesites dos menus. Simplemente cambia los estilos, posición, etc.


Saludos

[paxarin]

OK, mañana probare lo que me comentas.
Yo siempre puse los css del principal hacia menor resolución.
Podria ser eso, aunque cuando lo veo que firebug se respetan los estilos.