Fixed first coloumn when table scroll horizontaly

fixed table.css

/* source: https://dev.to/nicolaserny/table-with-a-fixed-first-column-2c5b */
/* work with bootstrap table css */

/* make the first coloumn of the (row head and body) sticky */
.table-sticky>tr>th:first-child,.table-sticky>tr>td:first-child {
  position: sticky;
  left: 0;
  background-color: inherit;
}

/* change the background color please, otherwise it will transparent  */
.table-striped .table-sticky>tr:nth-of-type(odd) td:first-child {
  background-color: rgba(242, 242, 242);
}

.table-striped .table-sticky>tr:nth-of-type(even) td:first-child {
  background-color: white;
}