A rather unpleasant bug has been discovered in Opera related to rendering the box-shadow property. If this property is assigned to an element with a :hover pseudo-class the shadow gets rendered incorrectly on mouse over event. Searching for the solution on the Internet provides no information. Experimentally it has been determined that a workaround exists in assigning the same shadow to an underlining element with the same size as element:hover. The shadow can be made transparent.
The bug has been reproduced in versions 10.54 and 10.60 for Mac OS. The illustration shows just how the shadow is rendered in blocks with the following properties:
/* top block */
div.first:hover {
box-shadow: 0 2px 10px #5f5
}
/* bottom block */
div.second {
box-shadow: 0 2px 10px rgba(0,0,0,0)
}
div.second:hover {
box-shadow: 0 2px 10px #5f5
}
This might help the web programmers, but hopefully the browser developers will notice it too and fix this tiny but unpleasant issue.
