JSFiddle - React, Tailwind, and code Playground

by MAeSI

HTML

<div id="header">
    <div class="no_trasf">
         <h1>Header</h1>

    </div>
</div>
<div id="content">
    <div class="no_trasf">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique lorem at faucibus posuere. Morbi lorem magna, hendrerit eget sem sed, imperdiet malesuada mauris. Morbi vitae sapien ipsum. Vestibulum at tortor ut ligula porttitor cursus. Nam nibh ante, ornare ut libero a, faucibus sagittis nibh. Nullam sit amet tempor libero, id consequat mi. Fusce et nibh tempus, sagittis eros nec, ullamcorper ante. Suspendisse potenti. Suspendisse id posuere eros. Proin auctor nulla a lacinia porta. Nulla facilisi.</div>
</div>
<div id="footer">
    <div class="no_trasf">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique lorem at faucibus posuere. Morbi lorem magna, hendrerit eget sem sed, imperdiet malesuada mauris. Morbi vitae sapien ipsum. Vestibulum at tortor ut ligula porttitor cursus. Nam nibh ante, ornare ut libero a, faucibus sagittis nibh. Nullam sit amet tempor libero, id consequat mi. Fusce et nibh tempus, sagittis eros nec, ullamcorper ante. Suspendisse potenti. Suspendisse id posuere eros. Proin auctor nulla a lacinia porta. Nulla facilisi.</div>
</div>

CSS

html, body {
    margin:0;
    padding:0;
    background-color:#ccc;
}
#header, #content, #footer {
    min-width:480px;
    transform:skew(0deg, 7deg);
    -ms-transform:skew(0deg, 7deg);
    -webkit-transform:skew(0deg, 7deg);
}
.no_trasf {
    transform:skew(0deg, -7deg);
    -ms-transform:skew(0deg, -7deg);
    -webkit-transform:skew(0deg, -7deg);
}
#header {
    min-height:280px;
    background-color:#fff;
}
#header div {
    padding:5% 2%;
    background-color:#fff;
}
#header h1 {
    transform:rotate(7deg);
    -ms-transform:rotate(7deg);
    -webkit-transform:rotate(7deg);
}
#content {
    min-height:280px;
    background-color:#336699;
}
#content div {
    padding:7% 2%;
}
#footer {
    min-height:200px;
    background-color:#ccc;
}
#footer div {
    padding:7% 2%;
}