JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outer">
    <p class="inner">
        Bacon chuck hamburger jerky tail, beef turkey pig cupim. Alcatra meatloaf porchetta salami fatback ground round kevin tail. 
    </p>
</div>

CSS

.inner{
    transform: skew(0deg, 5deg) ;
-webkit-transform: skew(0deg, 5deg) ;
-moz-transform: skew(0deg, 5deg) ;
-o-transform: skew(0deg, 5deg) ;
-ms-transform: skew(0deg, 5deg) ;
    padding:40px 20px;
}

.outer{
    background:#656565;
   transform: skew(0deg, -5deg) ;
-webkit-transform: skew(0deg, -5deg) ;
-moz-transform: skew(0deg, -5deg) ;
-o-transform: skew(0deg, -5deg) ;
-ms-transform: skew(0deg, -5deg) ;
    
    width:80%;
    margin:10%;
    color:#ffffff;
}