Giving hover on one element and changing the other is not working

Navigation
0

I looked for all the ways to give hover in one element and change another and some of them already knew and had trying but it was not working, so I went looking for others and I tried everything #example:hover + #change , #example:hover ~ #change , #example:hover #change , etc but none of them worked. So I went for the easiest solution, jQuery , but he was bugging when he applied the effects, sometimes applied other times not, I tried to go with the normal css again. But I could not find ways!

HTML : 

<div class="section">
     <img id="thumbnail" src="img.png">
     <h2 id="title"><center><span>Some title</span></center><h2>
</div>

CSS: 

#thumbnail:hover #title {
    font-size: 30px;
}
    
asked by anonymous 13.10.2017 / 10:22

1 answer

1

I did it in pure Js and it worked, but it is much more feasible to do in pure css

You did right, just put a "+" 

#title {
    font-size: 100px;
}

#imagem:hover + #title {
    font-size: 10px
}
<img id="imagem" src="https://cdn.sstatic.net/Sites/stackoverflow/img/[email protected]"width="50" height"50">

<div id="title">Some title</div>
    
13.10.2017 / 11:42
I can not connect the vuejs in Laravel How to remove the first key that surrounds all the values of a JSON