Как исправить размер страницы и ее элементов при увеличении и уменьшении

Question

Я работаю над веб-приложением, и при масштабировании сталкиваюсь с множеством проблем

Вот пример архитектуры страницы:

В последнее время клиент попросил нас настроить приложение с различными разрешениями, оригинал: (1280 * 1024), теперь мы добавили несколько медиа-запросов, чтобы они соответствовали (1600 * 900) & (1920 * 1080), в настоящее время приложение работает нормально в этих разрешениях, но мы сталкиваемся с одной проблемой, которая возникает, когда пользователь увеличивает или уменьшает масштаб, страница становится испорченной.

Я посмотрелонлайн, и я обнаружил, что мне нужно обернуть заголовок и содержимое в один элемент div и назначить поле: 0 auto;с max-width & max-height ..., я сделал это, но у меня все еще есть та же проблема.

Очевидно, проблема исчезает, когда я использую эмулятор в Internet Explorer, и я уточняю разрешение, такое как мы нижеприложение работает нормально при масштабировании, но когда эмулятор работает в режиме по умолчанию, возникает проблема.

Приложение очень старое и работает тольков режиме совместимости с IE11.

Так что мой вопрос, как исправить размер страницы в разных разрешениях без изменения эмулятора?

Answer 1

Приложение работает нормально, когда вы используете эмулятор, потому что вы определяете разрешение для него, и разрешение не изменяется при масштабировании в этой ситуации.

Но само масштабирование - это поведение, которое заставит браузер работать как разные устройства и определенно изменит разрешение, поэтому внешний вид будет другим.

Я думаю, вам просто нужно сделать медиа-запрос с часто используемыми разрешениями. Для получения дополнительной информации вы можете обратиться к этой теме .