On <a>
:hover, I need to apply some styles on div which is parent tag of <a>
.
Please note I don't want to use JQuery/ Java Script, rather I need to do it using CSS/ CSS3.
JSFiddler: http://jsfiddle.net/Yawer/2p6fL/
Here is my code:
a:hover{
background-color:GRAY;
a:hover:PARENT{
border:NONE !IMPORTANT;
}
HTML:
<div style="width:200px; height:200px;border:solid 1px;">
<span style="width:180px; height:180px;border:double 1px red;">
<a style="border:dashed 1px green;" href="#">It is a test link</a>
</span>
</div>
<br>
<br>
<div style="width:200px; height:200px;border:solid 1px;">
<a style="border:dashed 1px green;" href="#">It is a test link</a>
</div>
Edit: The question refered here as already asked was asked in 2011, I m asking may be in this period any development has happened.