JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" id="checkbox">
<span class='user_name'>
    Peter Green <span class='remove_user'><label for="checkbox" id="label">X</label></span>
</span>

CSS

#checkbox {
    left: -9999px;
    position: absolute;
}
#checkbox:hover + .user_name {
    background-color: #0f0;
}
.user_name {
    width: 400px;
    height: 200px;
    display: block;
    background: #f00;
}
#label {
    display: inline-block;
    background: #0f0;
    padding: 5px;
}
#label:hover {
    background: #f00;
}