JSFiddle - React, Tailwind, and code Playground

HTML

<p class="balloon">
    <span class="arrow">&nbsp;</span>
    Balloon
</p>

CSS

body{background:#222;}

.balloon{ 
    display:block; 
    position:absolute; left:40px; top:20px; 
    width:200px; height:60px; 
    background:#fff; padding:10px;
    -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;
}
    .balloon>.arrow{
        position:absolute; left:-10px; top:50%; margin-top:-8px;
        display:block;
        width: 0px;
        height: 0px;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-right: 10px solid #fff;
    }