Make div scrollable

Question

I have a div that I am displaying many things in that are related to laptop for filtering data. The div increases it\'s size as the data size increases in it.

I want

Answer 1

Place this into your DIV style

overflow:scroll;

Answer 2

You should add overflow property like following:

.itemconfiguration
    {   
        height: 300px; 
        overflow-y:auto;
        width:215px;
        float:left;
        position:relative;
        margin-left:-5px;
    }

Answer 3

You need to remove the

min-height:440px;

to

height:440px;

and then add

overflow: auto;

property to the class of the required div

Answer 4

Use overflow-y:auto for displaying scroll automatically when the content exceeds the divs set height.

See this demo

Answer 5

I know this is an older question and that the original question needed the div to have a fixed height, but I thought I would share that this can also be accomplished without a fixed pixel height for those looking for that kind of answer.

What I mean is that you can use something like:

.itemconfiguration
{
    // ...style rules...
    height: 25%; //or whatever percentage is needed
    overflow-y: scroll;
    // ...maybe more style rules...
}

This method works better for fluid layouts that need to adapt to the height of the screen they are being viewed on and also works for the overflow-x property.

---

I also thought it would be worth mentioning the differences in the values for the overflow style property as I've seen some people using auto and others using scroll:

visible = The overflowing content is not clipped and will make the div larger than the set height.

hidden = The overflowing content is clipped, and the rest of the content that is outside the set height of the div will be invisible

scroll = The overflowing content is clipped, but a scroll-bar is added to see the rest of the content within the set height of the div

auto = If there is overflowing content, it is clipped and a scroll-bar should be added to see the rest of the content within the set height of the div

Answer 6

use css overflow:scroll; property. you need to specify height and width then you will be able to scroll horizontally and vertically or either one of two scroll by setting overflow-x:auto; or overflow-y:auto;