html

<style type="text/css">
    body, html{
    margin: 0px;
    padding: 0px
}
.d1 {
    height: 560px;
    max-height: 100%;
    min-height: 100%;
    overflow-y: auto;
    background-color: red;
}
.d2 {
    background-color: green;
    height: 100%;
    overflow-y: scroll;
    max-height: 100%;
    min-height: 100%;
}
</style>
<div class="d1" style="border: 0px solid black">
    <div class="d2" style="border: 0px solid blue">
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
        a
        <br/>
    </div>
</div>