Home/ Questions/Q 6980139
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T17:58:33+00:00

CSS box-shadow works on Mozilla, but not on Chrome. If I use the class

  • 0

CSS box-shadow works on Mozilla, but not on Chrome.
If I use the class on div (i.e. div with id mydiv) it works!
Why am I not allowed to use box shadow on tr tag?

<!DOCTYPE html>                                                    
<html lang="en">                                                   
    <head>                                                         
    <style>
        .item_row:hover {
        box-shadow: 0px 0px 8px 2px #CCCCCC inset;                 
        -moz-box-shadow: 0px 0px 8px 2px #CCCCCC inset;            
        -webkit-box-shadow: 0px 0px 8px 2px #CCCCCC inset;         
        }                                                          
    </style>
    </head>
    <body>
        <div id='mydiv'>
            <table>
                <tr class='item_row'>                              
                <td>test</td>
                </tr>                                              
            </table>                                               
        </div>
    </body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Yes, just tested in Chrome.
    Instead of applying your css to the tr, instead apply to the child td:

    .item_row:hover td {
  box-shadow: 0px 0px 8px 2px #CCCCCC inset;                 
  -moz-box-shadow: 0px 0px 8px 2px #CCCCCC inset;            
  -webkit-box-shadow: 0px 0px 8px 2px #CCCCCC inset;         
}
    • 0