Как задать минимальную ширину сайта на мобильниках?

Question

[Михаил Р.]

Всем привет!

Имеется простая страница, при отображение на браузере мобильника (android-chrome) получаем результат, когда браузер не видит установленную ширину страницы в 800px и срезает часть страницы. Далее, чтобы увидеть всю страницу, нужно уменьшить масштаб на мобильнике.

Как сделать, чтобы мобильник изначально видел ширину страницы и сам уменьшал масштаб?
Спасибо!

Что есть по умолчанию:


Что должно быть по умолчанию:

Answer 1

[Михаил Р.]

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

<meta name="viewport" content="width=device-width, initial-scale=1">

поставить:

<meta name="viewport" content="width=device-width, shrink-to-fit=no">

Answer 2

[Gortyser]

Ну так у вас у html и body жестко задана ширина в 800 пикселей. Задайте max-width: 100%.

Comments

[Михаил Р.]

Хорошо, а как браузер тогда поймет, что ширина страницы должна быть 800px?

[Gortyser]

Mike Ro, вы хотя бы мой вариант попробовали? Цель конечная какая?

[Михаил Р.]

Gortyser, конечно пробовал. Цель - будет адаптивный сайт, ширина страницы которого не должны быть менее 800px.

[Socrates]

Mike Ro, про Media запросы слышали ?

[Михаил Р.]

Socrates, разумеется, с этим проблем не возникло.

[Михаил Р.]

run through, почему нет? Сайт адаптивный от 800px > 1440px, но делать его менее 800px нельзя.