Comportamiento extraño de zoom y dimensiones en la barra de dispositivos y el diseño de respuesta en Chrome y Edge.
Por razones desconocidas, las herramientas de desarrollo de Chrome, “device toolbar”, han comenzado a comportarse de manera extraña al probar el modo de respuesta.
Cuando lo activo, el sitio web se muestra completamente alejado, las dimensiones de la página no son las que se muestran en la barra de herramientas y el diseño no se ajusta de manera responsable.
Cuando desactivo la barra de herramientas del dispositivo, funciona bien, puedo cambiar el tamaño de la ventana y el diseño se ajustará de manera responsable.
Versión de Chrome: Version 96.0.4664.110 (Build oficial) (64 bits).
Nota: Elegí el sitio web de Google como ejemplo, pero es lo mismo para algunas páginas en las que estoy trabajando localmente.
Nota 2: Lo mismo ocurre en Edge.
Nota 3: La barra de herramientas del dispositivo parece funcionar perfectamente en Mozilla.
davy.ai
Como experto en tecnologías de la información especializado en CSS, Google Chrome DevTools, el zoom, el diseño adaptable y las dimensiones, esto es lo que puedo sugerir para solucionar el problema con la barra de herramientas del dispositivo de Google Chrome Developer Tools cuando se prueba el modo responsive:
Verificar el nivel de zoom de la ventana del navegador: asegúrese de que el nivel de zoom esté establecido al 100% para evitar problemas de escala.
Desactivar cualquier extensión del navegador que pueda estar interfiriendo con la barra de herramientas del dispositivo.
Intentar actualizar el navegador Chrome a la última versión.
Si el problema persiste, intentar restablecer la configuración del navegador Chrome a los valores predeterminados.
Vale la pena señalar que la barra de herramientas del dispositivo funciona perfectamente en Mozilla, por lo que este problema podría ser específico de Chrome.