Чтобы добавить полосу прокрутки к div, просто укажитеoverflowв качестве атрибутаautoВот и всё. В следующем примере для div устанавливается горизонтальная полоса прокрутки:

Пример

<div style="height:300px;width:70px;overflow:auto;background:#EEEEEE;">Учебный пример -- Вы изучаете не только технологии, но и мечты!!! Учебный пример -- Вы изучаете не только технологии, но и мечты!!! Учебный пример -- Вы изучаете не только технологии, но и мечты!!! Учебный пример -- Вы изучаете не только технологии, но и мечты!!!</div>

Попробуйте сами »

Ширину и высоту можно задать в соответствии с фактическими потребностями.

Приведённый выше пример показывает, что если высота содержимого div больше 300px, появится вертикальная полоса прокрутки; если меньше 300px, полосы прокрутки нет. Если ширина больше 70px, появится горизонтальная полоса прокрутки; если меньше, её нет.

Если вы хотите, чтобы полоса прокрутки всегда присутствовала в div, можно задать свойству overflow значение scroll:

Вы также можете задать overflow значение scroll, то есть:

Пример

<div style="height:300px;width:200px;overflow:scroll;background:#EEEEEE;">Учебный пример -- Вы изучаете не только технологии, но и мечты!!! Учебный пример -- Вы изучаете не только технологии, но и мечты!!! Учебный пример -- Вы изучаете не только технологии, но и мечты!!! Учебный пример -- Вы изучаете не только технологии, но и мечты!!!</div>

Попробуйте сами »

Дополнительные настройки

Задать только горизонтальную полосу прокрутки:

<div style="width:100px;overflow-x:auto"></div>

Установить только вертикальную полосу прокрутки:

<div style="height:300px;overflow-y:auto"></div>

Установить и горизонтальную, и вертикальную:

<div style="width:70px;height:300px;overflow-x:auto;overflow-y:auto"></div>

Для дополнительных статей см.:

CSS-макет - Переполнение

CSS-свойство overflow