0
<div class="menu-create-content__main-item">main item</div>

<div class="menu-create-content__sub-items">
  <div class="menu-create-content__sub-item">sub item1</div>
  <div class="menu-create-content__sub-item">sub item2</div>
  <div class="menu-create-content__sub-item">sub item3</div>
</div>

I need to change the background-color of the menu-create-content__main-item when mouse hover on menu-create-content__sub-item using CSS.

sajee
  • 247
  • 2
  • 8
  • 2
    Not possible atm. – VXp Nov 23 '17 at 06:56
  • 3
    Possible by using js or jquery... – Maths RkBala Nov 23 '17 at 06:57
  • Obligatory link: [Is there a CSS parent selector?](https://stackoverflow.com/q/1014861/1016716) – Mr Lister Nov 23 '17 at 07:07
  • @MrLister, it seems that OP wants to target the previous sibling, not the parent of the hovered element itself. – Ilya Streltsyn Nov 23 '17 at 07:10
  • 1
    @IlyaStreltsyn No, they want to target the previous sibling _of_ the parent of the hovered element. – Mr Lister Nov 23 '17 at 07:12
  • @MrLister, yes, but it means that even if _there were_ a parent selector, it wouldn't solve the problem. Hovewer, the generic `:has()` selector (from the Selectors Level 4), if implemented, could do this. – Ilya Streltsyn Nov 23 '17 at 07:55
  • Is there any reason why the hover needs to be on `..._sub-item` and cannot be on the wrapper `..._sub-items` ? There are dirty tricks like absolute positioned `:before` elements or misusing inputs and labels. But javascript is much cleaner here. – user3154108 Nov 23 '17 at 12:17

1 Answers1

1

It's impossible now. You can do this using jquery. On mouseover you can add class to menu-create-content__main-item and to this class add styles with background-color

Sylwek
  • 856
  • 1
  • 9
  • 24