Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Make text scrollable within div

I am looking to make some lengthy text contained into a div where the text can be viewed by scrolling up or down. Right now the "description" text is rendered like so <%= @pin.description.html_safe %> and is inside a <div class="panel-body> (I'm using Bootstrap).

like image 577
Cyzanfar Avatar asked Jul 23 '14 18:07

Cyzanfar


People also ask

How do you make a div text scrollable?

Making a div vertically scrollable is easy by using CSS overflow property. There are different values in overflow property. For example: overflow:auto; and the axis hiding procedure like overflow-x:hidden; and overflow-y:auto;.

How do I scroll content inside a div?

To fit all the text inside the div, the single-direction scrolling method will be used. You can apply it by placing the overflow-y:scroll in the id growth inside the style tag. Notice the scroll bar on the right side of the div .


1 Answers

Give your div a height and set overflow: scroll

#elementId{
    height: 200px;
    overflow: scroll;
}

If you only want it to scroll up/down and not left/right use:

overflow-y: scroll;

JSFIDDLE

like image 52
Jmh2013 Avatar answered Oct 10 '22 18:10

Jmh2013