CSS is it possible to use element after :hover? - html

Question

Is it possible to use element after hover effect
I tried like this
.tableclass tr td:hover a{
color:#fff;
}
what i am trying to do that when i hover the td so then anchor link inside that td should change its color to white..
here is how i tried my self but not working for me?
.GridAlternate td:hover a , .GridRowStyle td:hover a{
color:#fff;
}
My GridView HTML
<table cellspacing="0" border="1" style="border-collapse:collapse;" id="GV_Users" rules="rows" class="DefaultGridStyle">
<tbody><tr class="GridHeader">
<th scope="col">User Name</th><th scope="col">Role Name</th><th valign="middle" align="left" style="width:22%;" scope="col">LogIn</th><th valign="middle" align="center" style="width:33%;" scope="col">Action</th>
</tr><tr class="GridRowStyle">
<td>
Ali Nisarr
</td><td>
Admin
</td><td valign="middle" align="left">
alinisar#ken.com
</td><td valign="middle" align="center">
Edit
Remove
Disable
</td>
</tr><tr class="GridAlternate">
<td>
Nizam Ullah
</td><td>
Admin
</td><td valign="middle" align="left">
nizam#ken.com
</td><td valign="middle" align="center">
Edit
Remove
Disable
</td>
</tr><tr>
<td colspan="4">
<table class="GridPager">
<tbody><tr>
<td width="7%">
Showing
:
</td>
<td width="5%">
<span id="lbl_rowstartindex">1</span>
-
</td>
<td>
<span id="lbl_rowendindex">2</span>
</td>
<td>
of
</td>
<td>
<span id="lbl_totalrecords">2</span>
</td>
<td width="50%" align="center">
</td>
<td width="18%" align="right">
Displaying per page:
</td>
<td align="left">
<input type="text" id="TxBx_PageSize" maxlength="3" value="10" name="ctl00$CPH_Content$TC_SysUsers$TP_Users$GV_Users$ctl05$TxBx_PageSize">
</td>
<td align="left">
Change
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
Am i doing something wrong or is there any other approach i should follow?

Answer 1

try this;
tr.GridAlternate td:hover a , tr.GridRowStyle td:hover a{
color:#fff;
}
And make sure to insert this at the end of the style sheet. Maybe it is being override by other class.
I hope this helps

Answer 2

http://codepen.io/princemaple/pen/Dcxdi
It's totally working for me.
I assume some of your rules are wrongly cascaded?
Like you have more specific targeting rules overrides this rule...

Answer 3

Why dont you try
.tableclass td:hover a {
color:#fff;
}