JSFiddle - React, Tailwind, and code Playground

HTML

<span>1 
     <span>2
          <span>3</span> 
     </span> 
</span>

CSS

span {display:inline-block; border:3px solid black;}

span                     {width:100px; height:100px;}

span > span              {width:60px; height:60px;}

span > span > span       {width:20px; height:20px;}



span:hover > span        {background-color:orange;}

span:hover > span > span {background-color:blue;}