JSFiddle - React, Tailwind, and code Playground

HTML

<div>
     <h3>
           Some long title that expands the container      
    </h3>

</div>

CSS

* {
    padding:0 margin:0;
}
body {
    margin:20px;
    background:#fee url(http://subtlepatterns.com/patterns/wild_oliva.png);
}
div {
    display:table;
    position:absolute;
    z-index:2;
    overflow:hidden;
}
h3 {
    display:table-cell;
    position:relative;
    float:left;
    z-index:1;
    top:-10px;
    left:0px;
    font:bold 20px Verdana;
    white-space:nowrap;
    color:#ccc;
    transform:rotate(-2deg);
    -webkit-transform:rotate(-2deg);
    -ms-transform:rotate(-2deg);
    background:-moz-linear-gradient(10deg, transparent 30px, #000 10px), -moz-linear-gradient(150deg, transparent 30px, #000 10px);
    background:-webkit-linear-gradient(10deg, transparent 30px, #000 10px), -webkit-linear-gradient(150deg, transparent 30px, #000 10px);
    background-position: bottom left, bottom right;
    background-size: 50% 100%;
    background-repeat: no-repeat;
    padding:30px 40px 10px;
}