JSFiddle - React, Tailwind, and code Playground

by nniicc

HTML

<section class="">
    <div class="container">
        <table id='myTable01' border=1>
            <thead class='tableHead'>
                <tr class="categoriesTop">
                    <th rowspan=2>MA 2014</th>
                    <th class='borderLeft' colspan=0></th>
                    <th class='borderLeft categoriesThead' colspan=19>LpA Tageszeitungen</th>
                </tr>
                <tr class='vatcont'>
                    <td style='text-align:right'>
                        <div><span>Fälle</span>

                        </div>
                    </td>
                    <td style='text-align:right' class='borderLeft'>
                        <div><span>NRW Tageszeitungen</span>
                        </div>
                    </td>
                    <td style='text-align:right' class=''>
                        <div><span>Der Standard</span>

                        </div>
                    </td>
                    <td style='text-align:right' class=''>
                        <div><span>Die Presse</span>

                        </div>
                    </td>
                    <td style='text-align:right' class=''>
                        <div><span>Heute (GRATIS)</span>

                        </div>
                    </td>
                    <td style='text-align:right' class=''>
                        <div><span>Kronen
 Zeitung</span>

                        </div>
                    </td>
                    <td style='text-align:right' class=''>
                        <div><span>Kurier</span>

                        </div>
                    </td>
                    <td style='text-align:right' class=''>
                        <div><span>Österreich (GRATIS)</span>

                        </div>
                    </td>
                    <td style='text-align
:right' class=''>
                        <div><span>Wirtschaftsblatt</span>

                        </div>
                    </td>
              ...

CSS

html, body {
    margin:0;
    padding:0;
    height:100%;
}
section {
    position: relative;
    border: 1px solid #000;
    padding-top: 37px;
    background: #500;
}
section.positioned {
    position: absolute;
    top:100px;
    left:100px;
    width:800px;
    box-shadow: 0 0 15px #333;
}
.container {
    overflow-y: auto;
    height: 200px;
}
table {
    border-spacing: 0;
    width:100%;
}
td + td {
    border-left:1px solid #eee;
}
td, th {
    border-bottom:1px solid #eee;
    background: #ddd;
    color: #000;
    padding: 10px 25px;
}
th {
    height: 0;
    line-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    color: transparent;
    border: none;
    white-space: nowrap;
}
th div {
    position: absolute;
    background: transparent;
    color: #fff;
    padding: 9px 25px;
    top: 0;
    margin-left: -25px;
    line-height: normal;
    border-left: 1px solid #800;
}
th:first-child div {
    border: none;
}