tableタグで、左側のいくつかのセルを横スクロールされた際に固定したい

Question

画像のように、left,data1 ~ data3のセルを、横スクロールしたときに動かないように固定したいです。また上部の「head」の部分も上下スクロールのさい固定したいです。

左ヘッダ1列だけの固定ならネットでサンプルが見つかりますが、自分では複数列の固定に応用が効かせられず困っております。
解決策のご教示をお願いいたします。

Answer 1

こんな感じでどうでしょうか？
https://codepen.io/elzup/pen/YzqzGBj