0

I have this pseudo element as below:

.itembox::before {
    border: 2px solid red;
    content: '';
    top:25px;
    left:5px;
    right:40px;
    bottom:45px;
    display: inline-block;
    position: absolute;
}

 .itembox:hover::before .title  {
    background-color: red;
}

It is a simple "div" element named "itembox". I am trying to change the "title" div when the pseudo element is hovered over. Above code is not working. My HTML is as below:

<div class="itembox">
    <div class="title">Risk Management</div>
</div>
  • 1
    you cannot do this, pseudo element cannot catch hover event on their own. Only the main element can. Hovering the pseudo element will trigger the event on the main element – Temani Afif Jan 26 '20 at 23:09
  • 1
    There's no way to use a selector to draw a relationship from a pseudo-element to another element. – Quentin Jan 26 '20 at 23:10
  • 1
    @Quentin I don't think we need the duplicate for a parent selector here. Probably a one dealing about the hovering on pseudo elements – Temani Afif Jan 26 '20 at 23:11

0 Answers0