JSFiddle - React, Tailwind, and code Playground

by Boba Poshtar

HTML

<div class="box1">Hello 1</div>
<div class="box2">Hello 2</div>
<div class="box3">Hello 3</div>
<span>Simple text</span>

CSS

.box1, .box2, .box3 { background: orange; border: 1px solid red; cursor: wait;}
.box1, .box2, .box3 { margin: 10px 20px; padding: 20px 30px;}

.abox3 { display: inline;}
.abox2 { display: inline-block;}

.abox2 { display: none;}
.abox2 { visibility: hidden;}
.abox3 { opacity: 0;}
.abox3:hover + span { font-weight: bold; color: blue; font-style: italic;}