JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.datatables.net/r/bs/dt-1.10.9,fc-3.1.0/datatables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/r/bs-3.3.5/dt-1.10.9,fc-3.1.0/datatables.min.css">
<div class="container">
    
<table class="example-table table table-striped table-bordered" cellpadding="1" cellspacing="1">
				<thead>
			<tr>
				<th style="padding:0 70px;">&nbsp;</th><th class="day-type" colspan="55">Monday to Friday</th><th class="day-type" colspan="19">Saturday</th><th class="day-type" colspan="16">Sunday</th>
			</tr><tr>
				<th>&nbsp;</th><th class="service-type service-change first-service-of-day train"><span class="service-name">Train</span><span class="icon-disabled" aria-hidden="true" title="Disabled access"></span></th><th class="service-type service-change train"><span class="service-name">Train</span></th><th class="service-type service-change train"><span class="service-name">Train</span><span class="icon-disabled" aria-hidden="true" title="Disabled access"></span></th><th class="service-type service-change train"><span class="service-name">Train</span></th><th class="service-type service-change train"><span class="service-name">Train</span></th><th class="service-type service-change train"><span class="service-name">Train</span><span class="icon-disabled" aria-hidden="true" title="Disabled access"></span></th><th class="service-type service-change train"><span class="service-name">Train</span><span class="icon-disabled" aria-hidden="true" title="Disabled access"></span></th><th class="service-type service-change train"><span class="service-name">Train</span><span class="icon-disabled" aria-hidden="true" title="Disabled access"></span></th><th class="service-type service-change train"><span class="service-name">Train</span><span class="icon-disabled" aria-hidden="true" title="Disabled access"></span></th><th class="service-type service-change train"><span class="service-name">Train</span><span class="icon-disabled"...

CSS

.example-table {
}

.example-table th,
.example-table td {
    white-space: nowrap;
}

.DTFC_LeftBodyLiner, .DTFC_LeftBodyWrapper{
    height: auto !important;
}

JavaScript

var table = $('.example-table').DataTable( {
				scrollX: true,
                scrollCollapse: true,
                paging: false,
                bSort: false,
                bFilter: false,
                bInfo: false,
				fixedColumns:   {
					leftColumns: 1
				}

			} );