I have a window that is fixed to the bottom left of the browser window. Inside the window is a title bar that should remain at the top of the window and some content that sometimes is longer than the window can allow. I am attempting to add scrollbars to the content, but the content overflows the window and gets clipped off without creating scrollbars.

It's possible to add scrollbars to #WindowConsole but that makes the #WindowTitleBar scroll as well.

How do I make the #WindowContent div fit the parent space of the #WindowConsole and let it's content overflow with scrollbars?

[JSFiddle](https://jsfiddle.net/d5mu7jka/2/ "JsFiddle")

CSS

```
#WindowConsole {
    position: fixed;
    bottom: 0;
    left: 1;
    min-width: 10%;
    max-width: 27.4%;
    max-height: 50%;
}

#WindowContent {
    padding: 0px;
    overflow-y: scroll;
}

```

HTML

```
<div id="WindowConsole">
    <div id="WindowTitleBar">
        <span id="WindowTitle">Window</span>
        <a id="WindowMinimizeButton" href="">_</a>
    </div>
    <div id="WindowContent">
        Really long content
    </div>
</div>

```