JSFiddle - React, Tailwind, and code Playground

by NV

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
<head>
    <title>Table Test</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
</head>
<body>
    <table class="b-layout">
        <tr>
            <td class="b-layout__extra">
                extra
                <div class="b-layout__extra__i"></div>
            </td>
            <td class="b-layout__content">
                content
            </td>
            <td class="b-layout__sidebar">
                sidebar
                <div class="b-layout__sidebar__i"></div>
            </td>
        </tr>
    </table>
</body>
</html>

CSS

* {
    margin:0;
    padding:0;
}

body {
    font:.8em Arial, sans-serif;
    background:#fff;
    color:#fff;
}

.b-layout {
    width:100%;
    border-collapse:collapse;
}

.b-layout__content {
    width:200px;
}

.b-layout__extra__i, .b-layout__sidebar__i {
    width:150px;
}

.b-layout__extra {
    background:#444;
}

.b-layout__sidebar {
    background:#666;
}