JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
        <div class="headline">
            <div class="head-frame">
                Заголовок
            </div>
        </div>
        <div class="content">
            <div class="content-frame">
                Содержимое блока
            </div>
        </div>
    </div>

CSS

body { margin: 30px }
        .headline {
            background: #c9e39c;
            display: inline-block;
            max-width: 250px;
            border-radius: 10px 10px 0 0;
            box-shadow: 0 0 5px #000;
            -webkit-box-shadow: 0 0 5px #000;
            -moz-box-shadow: 0 0 5px #000;
            -ms-box-shadow: 0 0 5px #000;
            padding: 10px 0 0;
        }
        .head-frame {
            padding: 0 10px 20px;
            background: #c9e39c;
            display: block;
            margin: 0 0 -10px;
        }
        .content {
            background: #c9e39c;
            border-radius: 0 10px 10px 10px;
            box-shadow: 0 0 5px #000;
            -webkit-box-shadow: 0 0 5px #000;
            -moz-box-shadow: 0 0 5px #000;
            -ms-box-shadow: 0 0 5px #000;
        }
        .content-frame {
            background: #c9e39c;
            padding: 10px;
            position: relative;
            border-radius: 10px;
            min-height: 150px;
        }