Как адаптировать сайт под телефоны?

Question

[Pashtet221]

После копировании перестала работать адаптивность. Медиа-запросы. Сайт имеет непонятную структуру, каждый блок существует отдельно. Пробовал найти в инспекторе, там отображается только ширина body{}. Разрешения на 420px + кое-как сделал. Осталось сделать на 320px. Знаю что где-то ширина выступает. Прогнал через поиск и сделал чтобы максимальная ширина была 320px, прописал

body{
   box-sizing: border-box
}

.html{
   box-sizing: border-box
}

spoiler

Comments

[Сергей delphinpro]

в целом про адаптив https://yandex.ru/search/?text=адаптивная+верстка&...
Если умеете это, то осталось только найти конкретный блок, который выступает за пределы экрана.

0. Проверять удобнее в devtools

1 вариант. Открываем сайт, видим скролл, далее в devtools удаляем по одному блоку, пока скролл не пропадет. Так мы определим проблемное место.

2 вариант. Пропишем стиль
* { outline: 1px solid red !important; }
В результате все элементы получат рамки и мы сможем без особого труда увидеть какой блок косячит.

Иногда придется совместить оба варианта.

[Pashtet221]

Сергей delphinpro, Спасибо огромное, то, что нужно)

Answer 1

[Nik Faraday]

Медиа запосы