I just saw this code in an answer:
HTML
<div class="thumbnail">
<img src="http://placehold.it/50x50">
<img class="overthumb" src="http://placehold.it/200x200">
</div>
CSS
.overthumb { display: none; }
.thumbnail:hover .overthumb {
position: absolute;
top: 15px; left: 15px;
display: inline;
}
Live demo here: http://jsfiddle.net/6wQp3/
For this code to work .overthumb
must be a child of .thumbnail
.
But if some one has this code:
<div class="thumbnail">
<img src="http://placehold.it/50x50">
</div>
<p>tttttttttt</p>
How would you select the p
tag if .thumbnail
is hovered?
Live Demo
You can use the adjacent sibling selector
.thumbnail:hover + p {
background:yellow;
}
You can use the following selector
.thumbnail:hover + p
Example: http://jsfiddle.net/6wQp3/2/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With