Im trying to allow the inner div in my HTML to allow scrolling. I'm not sure what is preventing the scrolling. 

Here's my HTML:

```
<div class ="item item-text-wrap" ng-class="{show: showingdata, more: moreinfo}">
            <div>
                <!-- Stuff I don't want to have scroll -->
            </div>
            <div class="scrollable">
                    <!-- Scrollable Stuff Here -->
            </div>
</div>

```

And here's my CSS:

```
.item.item-text-wrap{
    z-index: 10;
    position: absolute;
    bottom: 0px;
    width:101%;
    max-height: 25px;
    color:rgba(255, 255, 255, 1);
    background-color: rgba(50, 50, 50, 0.75);
    border: 0;
    overflow: hidden;
    -webkit-transition: max-height .1s;
    transition: max-height .1s;
}

.item.item-text-wrap.show{
    max-height: 180px;
    height: 500px;
}

.scrollable{
    height: 1000px;
    position: relative;
    margin-bottom: 20px !important;
    overflow-y: scroll;

}

```

Note: In the past I've given the class .item.item-text-wrap a height value, although that has again not proved fruitful. 

Any and all help would be greatly appreciated!