JSFiddle - React, Tailwind, and code Playground

by tychio

HTML

<html>
    <head></head>
    <body>
        <div id="box">
            <div class="tri"></div>
            <div class="content"></div>
        </div>
    </body>
</html>

CSS

#box{
    position: absolute;
    display: block;
    float: left;
    top: 100px;
    left: 100px;
    width: 200px;
    z-index: 100;
    background: #CCC;
    border: 1px solid #999;
}
.content{ height: 200px; }
.tri{ position: absolute; z-index: 101; top: -10px; left: 50px; height: 0px; width: 0px; border: 10px solid transparent; border-top-width: 0; border-bottom-color: #CCC; }