JSFiddle - React, Tailwind, and code Playground

HTML

<div class="main">
 <p class="nice">
 Takie dela
 </p>
 <p class="nice">
 Stavropolskogo
 </p>
 <p class="nice-3">
 ПЁС
 </p>
</div>

CSS

.main {
  position:relative;
  top:0;
  left:0;
  width:30%;
}
.nice {
  color:black;
}
.nice-3 {
  width:36px;
}
.nice:hover,
.nice-3:hover{
    background-color:green;
}
p {
  width:100px;
}