Как мне предотвратить перемещение содержимого моего веб-сайта во время увеличения?

Question

Я не мог придумать правильную формулировку для этого вопроса, но вот моя проблема:

Когда пользователи нажимают Ctrl + Plus, чтобы увеличить мою страницу, контент, кажется, подталкивает друг друга. Например, у меня есть раздел навигации, плавающий самостоятельно в верхнем левом углу страницы.

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

Существует ли высокоуровневый способ, которым вы можете описать мне, как структурировать мою страницу так, чтобы масштабирование сохраняло стабильность и «просто увеличивало», не искажая первоначальное расположение?

Answer 1

Эта ссылка из "A List Apart" описывает некоторые размеры шрифтов и гибкую веб-разработку.Это должно дать вам хорошее руководство о том, как структурировать вашу страницу, чтобы адаптироваться к изменениям размеров шрифта.Вы также можете просмотреть медиазапросы , поскольку они позволяют применять стили на основе определенных характеристик браузера или устройства.

Answer 2

Как сохранить код в центре при масштабировании?

Центрирование кода при масштабировании?

ОТВЕТ:
Поместите этот тег div вне кода

   #wrapper
   {
   background-color: #F00;
   width: 400px;//This width can be anything according to your need
   margin-right: auto;//Note margin-right and left are allocated automatically
   margin-left: auto;
   }

Другой путь

   #wrapper
   {
   background-color: #F00;
   width: 400px;
   position:relative;
   }