Previous adjacent sibling selector workaround?

Question

I have two adjacent selectors that I would like to effect when hovering over the other. In the example below, the two selectors should effect the others CSS when hovered. Th

Answer 1

There's no previous selector in css. One way is to implement it wiht jQuery like @Alex Char pointed out, and other way is with hover on parent, instead the actual items, with pure css like this:

.a {
    width: 100px;
    height: 100px;
    background: red;
}
.b {
    width: 100px;
    height: 100px;
    background: blue;
}

.parent{             /* ADDED */
    width: 100px;
}

.parent:hover > div:not(:hover) {   /* ADDED */
    background: green;
}

    

        A
    
    

        B