JSFiddle - React, Tailwind, and code Playground

HTML

<div class="detail-container">
        <div class="detail-table">
            <div class="detail-row">
                <div class="detail-key">Name</div>
                <div class="detail-value">Value</div>
            </div>
            <div class="detail-row">
                <div class="detail-key">Description</div>
                <div class="detail-value">Value</div>
            </div>
            <div class="detail-block">
                <h3>HEADER</h3>
                <div class="detail-row">
                    <div class="detail-key">Metric</div>
                    <div class="detail-value">Values</div>
                </div>
                <div class="detail-row">
                    <div class="detail-key">Metric</div>
                    <div class="detail-value">Values</div>
                </div>
                <div class="detail-row">
                    <div class="detail-key">Metric</div>
                    <div class="detail-value">Values</div>
                </div>
                <div class="detail-row">
                    <div class="detail-key">Metric</div>
                    <div class="detail-value">Values</div>
                </div>
                <div class="detail-row">
                    <div class="detail-key">Metric</div>
                    <div class="detail-value">Values</div>
                </div>
                <div class="detail-row">
                    <div class="detail-key">Metric</div>
                    <div class="detail-value">Values</div>
                </div>
            </div>
            <div class="detail-block">
                <h3>HEADER</h3>
                <div class="detail-row">
                    <div class="detail-key">Metric</div>
                    <div class="detail-value">Values</div>
                </div>
                <div class="detail-row">
                    <div class="detail-key">Metric</div>
                    <div class="detail-value">Values</div>
                </div>
 ...

CSS

div.detail-block {
            position: relative;
            border-left: 30px solid #9e9e9e;
            display: inline-block;
        }

        div.detail-block h3 {
            font-family: Calibri, system-ui;
            font-size: 1.4rem;
            color: #f4f5f7;
            text-transform: uppercase;
            margin-left: -35px;
            position: absolute;
            bottom: -45px;
            left: 5px;
            text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
            -webkit-transform: rotate(270deg);
            -moz-transform: rotate(270deg);
            -ms-transform: rotate(270deg);
            -o-transform: rotate(270deg);
            transform: rotate(270deg);
            -webkit-transform-origin: 0 0;
            -moz-transform-origin: 0 0;
            -ms-transform-origin: 0 0;
            -o-transform-origin: 0 0;
            transform-origin: 0 0;
        }

        div.detail-container {
            width: 100%;
        }

        div.detail-row:hover {
            background: #ffffff;
        }

        div.detail-row {
            border-bottom: 1px solid #dddddd;
            line-height: 0.9;
        }

        div.detail-row .detail-key {
            width: 230px;
            background: #dfe1e5;
            border: 1px solid #ffffff;
            font-family: Calibri, system-ui;
            font-size: 16px;
            font-weight: 900;
            display: table-cell;
            padding: 3px 10px;
            text-align: right;
            justify-content: left;
        }

        div.detail-block .detail-key{
            width: 200px;
        }

        div.detail-row .detail-value {
            font-family: Consolas, system-ui;
            text-align: left;
            display: table-cell;
            padding: 3px 10px;
        }

        div.detail-block .detail-value{
            width: 500px;
        }

        .detail-container{
            display: table;
            width: 600px;
        }