JSFiddle - React, Tailwind, and code Playground

by Lalji Tadhani

HTML

<section class="javascript">
        <div class="js-wrapper">
            <h3>JAVASCRIPT</h3>
        </div>  
    </section>
    <section class="javascript">
        <div class="js-wrapper2">
            <h3>JAVASCRIPT</h3>
        </div>  
    </section>
    <section class="javascript">
        <div class="js-wrapper3">
            <h3>JAVASCRIPT</h3>
        </div>  
    </section>

CSS

body{
  margin:0;
}
.javascript:nth-child(2n+2) {
  text-align:right;
}
.js-wrapper {
    background-color: #8E8ABC;
    border-bottom-right-radius: 12em;
    border-top-right-radius: 12em;
    width: 40%;
    display:inline-block;
}
.js-wrapper2 {
    background-color: #8AACBA;
    border-bottom-left-radius: 12em;
    border-top-left-radius: 12em;
    width: 40%;
    display:inline-block;
}
.js-wrapper3 {
    background-color: #76B783;
    border-bottom-right-radius: 12em;
    border-top-right-radius: 12em;
    width: 40%;
    display:inline-block;
}