Diseño inestable en Pcs

[alzacon]

Ese código css sólo es del menú. Y no pareces que uses responsive design.

Dices que has probado em y rem. ¿Lo has usado tanto en los font-size como en los width, margin, padding, etc?


Pero el problema con los % es muy sencillo.
- % toma como valor de referencia el del elemento padre, en su defecto "abuelo", "bisabuelo",... , elemento body y en ultimo termino del html.
- la anchura viene determinada por la anchura del display del navegador. El 100% del html por defecto será prácticamente el ancho de la resolución de tu monitor (con el navegador maximizado)
- El tamaño de la fuente si no lo indicas toma el que tenga el navegador por defecto, suele ser 16px, para el elemento html.
Ahora toca hacer cuentas de cuanto ocupa por ejemplo donde está el texto "Menu Principal" en cada pantalla y comparar con lo que ocupa de ancho el texto en una linea (con el mismo tamaño de fuente, como creo que tienen).