user3550879
user3550879

Reputation: 3469

child affecting parent on hover

looking for the css of a child to affect the parent

I have seen/used

.linkage:hover ~ .cover 
.linkage:hover + .cover 
.linkage:hover > .cover 

Is there one that would affect the parent of .linkage?

ex

<div class = "container">
 <div class="linkage"></div>
</div>

css

.linkage:hover ????? .container

Upvotes: 0

Views: 481

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388316

You can't do that, but you can make use of jQuery/javascript event handlers to do it

$('.linkage').hover(function(e) {
  $(this).closest('.container').toggleClass('link-hover', e.type == 'mouseenter')
})
.container.link-hover {
  background-color: lightgrey;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="container">
  container
  <span class="linkage">linkage</span>
</div>

Upvotes: 1

Related Questions