Браузер не масштабируется ниже 400 пикселей?

Question

Я работаю над составлением жидкой таблицы стилей, и она прекрасно работает. Одна вещь, которую я заметил, заключается в том, что размер окна моего браузера в Chrome не будет меньше 400 пикселей, он просто застревает там, а в FF, когда я уменьшаю его, он просто останавливается на отметке 400 пикселей, а затем появляется горизонтальная полоса прокрутки.

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

Мне было бы любопытно, если бы кто-нибудь знал, был ли это браузер / рабочий стол или я должен был смотреть на что-то другое, чем мой CSS. У меня нет объявлений минимальной ширины, поэтому я не уверен, что может быть причиной этого.

Опять на рабочем столе он уменьшается до минимальной ширины около 400 пикселей и останавливается, но когда я открываю его на своем телефоне, он масштабируется до размера экрана телефона, который составляет примерно 320 пикселей ... Любопытно, почему на самом по крайней мере, он не уменьшится до 320 пикселей на рабочем столе.

-edit- Также я не уверен, имеет ли это значение, но Opera позволяет уменьшить его до практически ничего ... Так что он работает с Opera, а не с Chrome или FF ... Есть идеи?

Answer 1

DevTools в Chrome существенно продвинулись с того времени, когда большинство этих ответов были опубликованы. Лучший способ решить эту проблему сейчас - использовать эмуляторы, встроенные в Chrome.

Чтобы использовать эмуляторы, откройте DevTools (нажмите F12) и затем щелкните следующий значок, чтобы переключить Device Toolbar:

Это позволит вам эмулировать любое мобильное устройство или размер области просмотра.

Answer 2

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

Answer 3

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

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

http://lab.maltewassermann.com/viewport-resizer/

Answer 4

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