HTML
<div class="sidebar">
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
</div>
<div class="header">
<h2>Title</h2>
</div>
<div class="scrollable">
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
<p>Some Text</p>
</div>
CSS
.sidebar {
position: fixed;
width: 25%;
overflow: auto;
top: 0;
bottom: 0;
}
.header {
position: fixed;
left: 35%;
}
.scrollable {
position: fixed;
width: 25%;
left: 35%;
overflow: auto;
top: 70px;
bottom: 0;
}