JSFiddle - React, Tailwind, and code Playground
HTML
<div class="moduleContentContainer">
<div id="dash-board-container">
<div class="dash-board-item">
<div class="title">pENDING QUOTES</div>
<div class="quote_list_container">
<table>
<thead>
<tr>
<th>Names</th>
</tr>
</thead>
<tbody>
<tr>
<td>ssss</td>
</tr>
<tr>
<td>ssss</td>
</tr>
<tr>
<td>ssss</td>
</tr>
<tr>
<td>ssss</td>
</tr>
<tr>
<td>ssss</td>
</tr>
<tr>
<td>ssss</td>
</tr>
<tr>
<td>ssss</td>
</tr>
<tr>
<td>ssggggss</td>
</tr>
<tr>
<td>ssggggss</td>
</tr>
<tr>
<td>ssggggss</td>
</tr>
<tr>
<td>ssggggss</td>
</tr>
<tr>
<td>ssggggss</td>
</tr>
<tr>
<td>ssggggss</td>
</tr>
<tr>
<td>ssggggss</td>
</tr>
<tr>
<td>ssggggss</td>
</tr>
<tr>
...CSS
body {
overflow: auto;
position: relative;
}
html, body, .moduleContentContainer {
height: 100%;
}
.title {
height: 30px;
}
#dash-board-container {
position: absolute;
height: 90%;
}
.dash-board-item {
height: 100%;
margin-right: 20px;
display: inline-block;
border-style: solid;
max-width: 700px;
min-width: 300px;
border-color: #999999;
border-width: 1px;
padding-left: 10px;
padding-right: 10px;
position: relative;
}
.quote_list_container {
max-height: calc(100% - 30px);
overflow: auto;
position: relative;
}