JSFiddle - React, Tailwind, and code Playground

by Milos Maric

HTML

<div class="wrap">
    <table class="head" border="1" style="margin-bottom:0;">
        <tr>
            <th width="10%">Col 1</th>
			<th width="10%">Col 2</th>
			<th width="15%">Col 3</th>
			<th width="30%">Col 4</th>
			<th width="30%">Col 5</th>
			<th width="5%" style=' padding:5px 0 5px 0;'> 6</th>
        </tr>
    </table>
    <div class="inner_table">
        <table>
            <tr>
                <td width="10%">Nesto 1</td>
                <td width="10%">Nesto 2</td>
                <td width="15%"> NEsto 3</td>
                <td width="30%">Nesto 4</td>
                <td width="30%"> NEsto 3</td>
                <td width="5%">4</td>
            </tr>
            <tr>
                <td width="10%">Nesto 1</td>
                <td width="10%">Nesto 2</td>
                <td width="15%"> NEsto 3</td>
                <td width="30%">Nesto 4</td>
                <td width="30%"> NEsto 3</td>
                <td width="5%">4</td>
            </tr> <tr>
                <td width="10%">Nesto 1</td>
                <td width="10%">Nesto 2</td>
                <td width="15%"> NEsto 3</td>
                <td width="30%">Nesto 4</td>
                <td width="30%"> NEsto 3</td>
                <td width="5%"> 4</td>
            </tr> <tr>
                <td width="10%">Nesto 1</td>
                <td width="10%">Nesto 2</td>
                <td width="15%"> NEsto 3</td>
                <td width="30%">Nesto 4</td>
                <td width="30%"> NEsto 3</td>
                <td width="5%"> 4</td>
            </tr> <tr>
                <td width="10%">Nesto 1</td>
                <td width="10%">Nesto 2</td>
                <td width="15%"> NEsto 3</td>
                <td width="30%">Nesto 4</td>
                <td width="30%"> NEsto 3</td>
                <td width="5%"> 4</td>
            </tr>
        </table>
    </div>
</div>

CSS

.wrap {
    width: 100%;
}

.wrap table {
    width: 97%;
    table-layout: fixed;
}

.inner_table table tr td {
    padding: 5px;
    border: 1px solid #eee;
    border: 1px solid #54769a;
    /*width: 100px;*/
    word-wrap: break-word;
    background-color: white;
}
.inner_table table tr td a{
    display:block;
}
.inner_table table{
    margin-right: 0;
}
.wrap table.head tr th {
    color:white;
    padding: 5px;
    background-color: #8CB1DA;
}

.inner_table {
    height: 100px;
    overflow-y: auto;
    margin: 0;
    padding: 0;
}