JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>work 2</title>
    <style type="text/css">
        * {
            margin:0;
            padding:0;
        }
        body {
            font: 14px/16px Arial, Tahoma, Verdana, sans-serif;
            padding:20px;
        }
        .tabwrap {
            width:100%;
        }
        .tab {
            background:#c9e39c;
            max-width:250px;
            padding:10px;
            float:left;
            -webkit-border-radius: 10px 10px 0 0;
            -moz-border-radius: 10px 10px 0 0;
            -o-border-radius: 10px 10px 0 0;
            border-radius: 10px 10px 0 0;
            border-top:1px solid #a7c17a;
            border-left:1px solid #a7c17a;
            border-right:1px solid #a7c17a;
            margin:0 0 -1px;
            position:relative;
            box-shadow:0 0px 5px #888;
        }
        .tabcont {
            background:#c9e39c;
            min-height:200px;
            padding:0px;
            clear:both;
            -webkit-border-radius: 0 3px 10px 10px;
            -moz-border-radius: 0 3px 10px 10px;
            -o-border-radius: 0 3px 10px 10px;
            border-radius: 0 3px 10px 10px;
            border:1px solid #a7c17a;
            box-shadow:0 0 5px #888;
        }
        .mask {
            background:#c9e39c;
            min-height:200px;
            padding:10px;
            clear:both;
            -webkit-border-radius: 0 3px 10px 10px;
            -moz-border-radius: 0 3px 10px 10px;
            -o-border-radius: 0 3px 10px 10px;
            border-radius: 0 3px 10px 10px;
            position:relative;
        }
    </style>
</head>
<body>
    <div class="tabwrap">
        <div class="tab">
            <h1>Заголовок</h1>
        </div>
        <div class="tabcont">
            <div class="mask">
                <p>Содержимое блока</p>
            </div>
        </div>
    </div>
</body>
</html>

CSS

* {
            margin:0;
            padding:0;
        }
        body {
            font: 14px/16px Arial, Tahoma, Verdana, sans-serif;
            padding:20px;
        }
        .tabwrap {
            width:100%;
        }
        .tab {
            background:#c9e39c;
            max-width:250px;
            padding:10px;
            float:left;
            -webkit-border-radius: 10px 10px 0 0;
            -moz-border-radius: 10px 10px 0 0;
            -o-border-radius: 10px 10px 0 0;
            border-radius: 10px 10px 0 0;
            border-top:1px solid #a7c17a;
            border-left:1px solid #a7c17a;
            border-right:1px solid #a7c17a;
            margin:0 0 -1px;
            position:relative;
            box-shadow:0 0px 5px #888;
        }
        .tabcont {
            background:#c9e39c;
            min-height:200px;
            padding:0px;
            clear:both;
            -webkit-border-radius: 0 3px 10px 10px;
            -moz-border-radius: 0 3px 10px 10px;
            -o-border-radius: 0 3px 10px 10px;
            border-radius: 0 3px 10px 10px;
            border:1px solid #a7c17a;
            box-shadow:0 0 5px #888;
        }
        .mask {
            background:#c9e39c;
            min-height:200px;
            padding:10px;
            clear:both;
            -webkit-border-radius: 0 3px 10px 10px;
            -moz-border-radius: 0 3px 10px 10px;
            -o-border-radius: 0 3px 10px 10px;
            border-radius: 0 3px 10px 10px;
            position:relative;
        }