FAQ: Создание прокрутки

В последнее время многие пользователи спрашивают, как поставить прокрутку. Чтобы сэкономить время и им и нам, я выкладываю подробную инструкцию по прокрутке.
Для начала решите, куда Вы будете ставить прокрутку. Это не так важно, но если Вы хотите вставить в таблицу, немаловажно куда в код таблицы Вы впихнете прокрутку. Если куда-нибудь в середину - и таблица и прокрутка, все будет наперекосяк. Так что делаем вот что: в таблице ищите контент, который хотите поставить в прокрутку. Потом в начале и в конце текста ставьте нижеприведенные теги.

<div style="width: 100%; height: 100%; overflow-y: scroll;">ВАШ КОНТЕНТ</div>

Красное - ширина прокрчиваемой области.
Синее - высота.
Розовое - ось прокрутки. y - вертикально, x - горизонтально.
Зеленое - то, что должно прокручиваться, непосредственно, Ваш текст.
Собственно, это всё. Вы создали прокрутку.
Но можно еще сделать полосу прокрутки стилизованной. Сейчас она будет такой же, как прокрутка в браузере, т.е. соответствующей теме в Windows (или других ОС). А можно сделать так, чтобы она была одного цвета независимо от темы и браузера.
Берем наш div - эту строчку:

<div style="width: 100%; height: 100%; overflow-y: scroll;">ВАШ КОНТЕНТ</div>

Добавляем после overflow-y: scroll; одно или несколько из этих свойств:

scrollbar-base-color:lime
Приведет скролл к такому виду:

__________

Можно сделать более тонкие настройки, для каждого элемента указывая свои значения:

scrollbar-3dlight-color
- задает цвет верхней и левой границ полосы прокрутки, ее бегунка и стрелок.

-----------------------------------------------------------------------------------------------------

scrollbar-arrow-color
- задает цвет стрелок на кнопках полосы прокрутки.
- задает цвет верхней и левой границ полосы прокрутки, ее бегунка и стрелок.

-----------------------------------------------------------------------------------------------------

scrollbar-darkshadow-color
- задает цвет "тени", отбрасываемой бегунком и кнопками полосы прокрутки (цвет правых и нижних гранией).

-----------------------------------------------------------------------------------------------------

scrollbar-face-color
- задает основной цвет бегунка и кнопок прокрутки полосы прокрутки.

-----------------------------------------------------------------------------------------------------

scrollbar-highlight-color
- задает цвет "освещенной" части бегунка и кнопок прокрутки полосы прокрутки (цвет левых и верхних их граней).

-----------------------------------------------------------------------------------------------------

scrollbar-shadow-color
- задает цвет "неосвещенной" части бегунка и кнопок прокрутки полосы прокрутки (цвет правых и нижних их граней). Не путать с цветом "тени", задаваемым атрибутом scroll-darkshadow-color.

-----------------------------------------------------------------------------------------------------

scrollbar-track-color
- задает цвет фона полосы прокрутки, той ее части, по которой перемещается бегунок.

Значения и картинки взяты отсюда: тык