Nowadays, this is possible to achieve using CSS only with position: sticky
property.
Here goes a snippet:
(jsFiddle: https://jsfiddle.net/hbqzdzdt/5/)
.grid-container {_x000D_
display: grid; /* This is a (hacky) way to make the .grid element size to fit its content */_x000D_
overflow: auto;_x000D_
height: 300px;_x000D_
width: 600px;_x000D_
}_x000D_
.grid {_x000D_
display: flex;_x000D_
flex-wrap: nowrap;_x000D_
}_x000D_
.grid-col {_x000D_
width: 150px;_x000D_
min-width: 150px;_x000D_
}_x000D_
_x000D_
.grid-item--header {_x000D_
height: 100px;_x000D_
min-height: 100px;_x000D_
position: sticky;_x000D_
position: -webkit-sticky;_x000D_
background: white;_x000D_
top: 0;_x000D_
}_x000D_
_x000D_
.grid-col--fixed-left {_x000D_
position: sticky;_x000D_
left: 0;_x000D_
z-index: 9998;_x000D_
background: white;_x000D_
}_x000D_
.grid-col--fixed-right {_x000D_
position: sticky;_x000D_
right: 0;_x000D_
z-index: 9998;_x000D_
background: white;_x000D_
}_x000D_
_x000D_
.grid-item {_x000D_
height: 50px;_x000D_
border: 1px solid gray;_x000D_
}
_x000D_
<div class="grid-container">_x000D_
<div class="grid">_x000D_
<div class="grid-col grid-col--fixed-left">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>Hello</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>P</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
<div class="grid-col grid-col--fixed-right">_x000D_
<div class="grid-item grid-item--header">_x000D_
<p>HEAD</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
<div class="grid-item">_x000D_
<p>9</p>_x000D_
</div>_x000D_
</div>_x000D_
_x000D_
</div>_x000D_
</div>
_x000D_
Regarding compatibility. It works in all major browsers, but not in IE. There is a polyfill for position: sticky
but I never tried it.