JSFiddle - React, Tailwind, and code Playground

Nice Tooltip like Box

by bitstarr

HTML

<div class="note">
    <p>Lorem stolen by http://chopapp.com</p>
</div>

CSS

html {font: 1em/1.5 sans-serif;}
.note {
    background: none repeat scroll 0 0 #111B25;
    border-radius: 3px 3px 3px 3px;
    border-top: 1px solid #111B25;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.35) inset;
    font-size: 14px !important;
    margin-left: 50px !important;
    padding-bottom: 20px;
    padding-left: 18px !important;
    padding-top: 16px;
    position: relative;
    min-width: 200px;
    max-width: 300px;
    word-wrap: break-word;
    z-index: 10;
    color: #fff;
}
.note:before {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: transparent transparent #111B25;
    border-style: solid;
    border-width: 8px;
    content: "";
    display: block;
    height: 0;
    left: 60px;
    position: absolute;
    top: -14px;
    width: 0;
    z-index: 15;
}