0
<ul class="timeline">
    <li>
      <div class="timeline-badge blue"></div>
      <div class="timeline-panel"></div>
    </li>
    <li>
      <div class="timeline-badge blue"></div>
      <div class="timeline-panel"></div>
    </li>
</ul>

How do I hover over the .timeline-panel to change the style to the .timeline-badge. independent inside the hover li? I tried in many ways but without a positive result, only the li:hover .title-badge {} was the closest, only I need that when I hover over .timeline-panel to change the css to .timeline-badge independently on each li ..

Cristian Ilisei
  • 45
  • 8
  • 1
    Does `.timeline > li:hover > .timeline-badge:not(:hover)` fit your needs? – chriskirknielsen May 04 '20 at 22:21
  • Thanks, but it's the same as them: hover .title-badge, i need something like .timeline-panel: hover .timeline-badge .. but independently on each li .. – Cristian Ilisei May 04 '20 at 22:24
  • Reversing the order of the elements would allow you to use the sibling selector. `.timeline-panel:hover + .timeline-badge { ... }`. Eg. https://jsfiddle.net/sx2pw8ub/1/ – Turnip May 04 '20 at 22:24
  • now it doesn't hover at all :)) .. – Cristian Ilisei May 04 '20 at 22:28
  • I must have misunderstood you: [this result](https://jsfiddle.net/chriskirknielsen/g8Lq5a7n/3/) isn't what you're after? – chriskirknielsen May 04 '20 at 22:29
  • One way to hack it is putting the badge after the panel, and use adjacent sibling selector to hover, with reversing the order with flexbox direction. I was preparing an answer but @TemaniAfif has closed the question. – Taha Paksu May 04 '20 at 22:32
  • @TahaPaksu if you check the duplicate, you will find the trick you described there. I am not simply closing the quesiton. I am closing as duplicate and giving a helpful link – Temani Afif May 04 '20 at 22:33
  • https://jsfiddle.net/ewkf31h8/ is my style, I want that badge to be white when I hover over the panel – Cristian Ilisei May 04 '20 at 22:34
  • 1
    https://jsfiddle.net/bpwck46v/ , and @TemaniAfif yes I didn't check that, I was writing the answer. Sorry. – Taha Paksu May 04 '20 at 22:35

0 Answers0