Как убрать полосу прокрутки

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

Из-за чего она появляется? Конечно же из-за нехватки места, при чем если место увеличить, то полоса прокрутки может так же остаться. Как убрать полосу прокрутки? Для этого надо вооружиться инспектором кода. Который покажет, а подчас и нарисует или выделить места, которые превышают размеры экрана. У элементов в верстке все тем же инспектором смотрим, что стоит в свойствах. Особенно обращаем внимание на margin и padding так как эти отступы чаще всего и являются причиной появления полосы прокрутки.

Вспомним так же о css свойстве overflow:hidden; которое будучи применено к элементу обрежет все, что вылезает за края элемента. Но это скорее крайний случай и обычно это свойство применяет не для обрезания выходящих за границы элементов.

Простой способ быстро найти источник полосы прокрутки

Порой в большой сверстанной странице сложно найти элемент, который портит нашу верстку или же эту разметку верстал кто-то до нас. У меня есть один простой прием, как достаточно быстро найти проблему.

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

Как убрать полосу прокрутки

У нас откроется разметка того элемента, который мы выбрали. Полностью очищаем всю разметку и смотрим исчез ли скролл на странице. Суть этой вещи в том, что мы можем всего за 2-3 таких действия сразу же обнаружить в какой части сайта верстка создает скролл своим присутствием.