Box Shadow on table row not appearing on certain browsers

Question

CSS box-shadow on table rows - tr - doesn\'t seem to be working consistently across browsers. On some browsers the shadow is displayed; on others, there is no s

Answer 1

Reasons behind it seem down to default CSS - the display: block was the biggest factor.

CSS / HTML / Demo

tr {
  background-color: rgb(165, 182, 229);
  display: block;
  margin-bottom: 5px;
  -moz-box-shadow: 0px 2px 2px black;
  -webkit-box-shadow: 0px 2px 2px black;
  box-shadow: 0px 2px 2px black;
}
td,th {
  padding: 5px;
  text-align: left;
}

  

    
 
    
One
    
Two
  
  

    
Title
    
Three
    
Four
  
  

    
Title2
    
Five
    
Six
  
  

    
Title3
    
Seven
    
Eight
  
  

    
Title4
    
Nine
    
Ten