JSFiddle - React, Tailwind, and code Playground

HTML

<div class="conatiner">
    <div class="pointyHeader"></div>
    <div class="content">
         your dynamic content here<br>
        your dynamic content here<br>
        your dynamic content here<br>
        your dynamic content here<br>
    </div>
    <div class="pointyFooter"></div>
</div>

CSS

body{
    background:#8DCDEA;
}

div{
    padding:0px;
    margin:0px;
}

.pointyHeader{    background:url(http://dribbble.s3.amazonaws.com/users/6567/screenshots/805937/dribbble-shot.png) center -40px no-repeat;
    height:20px;
    width:100%;
}

.pointyFooter{    background:url(http://dribbble.s3.amazonaws.com/users/6567/screenshots/805937/dribbble-shot.png) center -240px no-repeat;
    height:20px;
    width:100%;
}

.conatiner{
    width:200px;
}

.content{
    text-align:center;
    background:white;
}