Нередко возникает такая проблема, что при создании мобильной версии сайта (адаптивной верстке) или доработке чужого сайта, какой-то элемент выходит за края экрана. При этом нарушается адаптивность сайта и появляется горизонтальный скролл.
Есть лайфхак что бы найти такой элемент. Для этого нам нужно с помощью CSS задать всем элементам нашего сайта обводку.
Для этого открываем нашу страницу и нажимаем F12 или щелкнуть правой кнопкой «Посмотреть код».
Выбираем стили нашего сайта
и вставляем этот CSS код:
* { border: 1px solid blue; }
Получаем такое результат:
Если элемент выходит за края, вы его сразу увидите. Так же можно переключиться на мобильную версию, и повторить все тоже самое. А потом уже исправить нужный элемент с помощью css.