scroll without scrolllbar
HTML
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<body>
<div class="headers-calendar">
<table class="table-responsive calendar" width="100%" cellspacing="0" cellpadding="0">
<tbody><tr class="calendar-row">
<td class="calendar-day ">
<small >Thu</small>
<span class="day-number today">24</span><br>
<small>May</small>
</td>
<td class="calendar-day ">
<small>Fri</small>
<span class="day-number">25</span><br>
<small>May</small>
</td>
<td class="calendar-day ">
<small>Sat</small>
<span class="day-number">26</span><br>
<small>May</small>
</td>
<td class="calendar-day ">
<small>Sun</small>
<span class="day-number">27</span><br>
<small>May</small>
</td>
<td class="calendar-day ">
<small>Mon</small>
<span class="day-number">28</span><br>
<small>May</small>
</td>
<td class="calendar-day ">
<small>Tue</small>
<span class="day-number">29</span><br>
<small>May</small>
</td>
<td class="calendar-day ">
<small>Wed</small>
<span class="day-number">30</span><br>
<small>May</small>
</td>
<td class="calendar-day ">
<small>Thu</small>
<span class="day-number">31</span><br>
<small>May</small>
</td>
<td class="calendar-day ">
<small>Fri</small>
<span class="day-number">01</span><br>
<small>Juin</small>
</td>
<td class="calendar-day ">
<small>Sat</small>
<span class="day-number">02</span><br>
<small>Juin</small>
</td>
<td class="calendar-day ">
<small>Sun</small>
<span...
CSS
body{margin:0}
.row {
background: #f8f9fa;
margin-top: 20px;
}
.col {
border: solid 1px #6c757d;
padding: 10px;
}
.body{padding:15px}
.headers-calendar{
box-shadow:2px 1px 2px grey
}
.calendar{
overflow:hidden
}
.calendar-row{
overflow-x:auto
}
.calendar-day{
padding:5px 10px;
text-align:center;
}
.day-number{
font-weight:bold
}
.today{
color:indigo
}