JSFiddle - React, Tailwind, and code Playground
HTML
<p id="project">Click</a>
<div id="abproject"><p id="abprojectt">Text
<p></div>
CSS
#project
{
width: 400px;
height: 80px;
background-color: #0a5eb0;
display: inline-block;
cursor: pointer;
margin-top: 50px;
border-radius: 5px;
opacity: 0.8;
line-height: 80px;
color:#fff;
font-size: 35px;
}
#abproject
{
border-radius: 10px;
margin-top: 100px;
margin-left:10px;
width: 100px;
height: 91px;
background-color: black;
opacity: 0.9;
}
#abprojectt
{
color:#fff;
font-size: 28px;
line-height: 100px;
}
JavaScript
$(document).ready(function(){
$("#project").click(function () {
$("#abproject").fadeToggle("slow");
});
});