Div with scrollbar inside div with overflow:hidden

Question

So basically I have this div with height:400px and inside of it I have a div with dynamic height, what I want to do is if the div inside the main div exceeds 400px in height then it should have a scrollbar so I can scroll to the bottom of it. Can I do this in css or I need javascript ?

Does inside div: height:400px;overflow:auto; work?

Slavenko Miljic
– Slavenko Miljic

2013-12-17 07:52:10 +00:00
Commented Dec 17, 2013 at 7:52 — Slavenko Miljic
– Slavenko Miljic, Commented Dec 17, 2013 at 7:52

Sachin · Accepted Answer · 2013-12-17 07:52:01Z

1

You need to use

overflow-y:auto

with your parent div container.

Js Fiddle Demo

answered Dec 17, 2013 at 7:52

Sachin

41.1k7 gold badges94 silver badges107 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

user2678106 · Accepted Answer · 2013-12-17 07:53:01Z

0

try this line:

overflow-x:hidden;

answered Dec 17, 2013 at 7:53

user2678106

Comments

roo2 · Accepted Answer · 2013-12-17 07:56:10Z

0

The only good reason to do this is if you cannot modify the div with overflow:hidden and need a background color/border that resizes with content.

HTML

<div class="d1">

    <div class="d2">
          <div class="d3"> D3 will resize with content</div>
    </div>
</div>

CSS

.d1{height:400px; overflow:hidden}
.d2{height:400px; overflow:auto; }
.d3{background-color:#F00;}

answered Dec 17, 2013 at 7:56

roo2

6,0712 gold badges34 silver badges45 bronze badges

Comments

Aamir Shahzad · Accepted Answer · 2013-12-17 08:33:09Z

0

Simply use this:

#container
{
    height: 400px;
    overflow-y: scroll;
}
.dynamic-height
{
    height: auto;
}

jsfiddle

answered Dec 17, 2013 at 8:33

Aamir Shahzad

6,8848 gold badges49 silver badges72 bronze badges

Collectives™ on Stack Overflow

Div with scrollbar inside div with overflow:hidden

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related