Safari 6 css hover bug

0
votes

Here is the example of the problem: http://jsfiddle.net/wibbletech/gRshU/

The items in the list are relative position divs (its a simple list of font names). The css hover changes the background-color for the items. However, the last item in the list (monospace) only applies the hover setting when mouse is over the top half of that item.

I get this problem on Safari 6.0 (8536.25), Chrome 21.0.1180.79, and Webkit 6.0 (8536.25, 537+). However, Opera 11.66 and Firefox 14.0.1 work fine.

I'm using 2012 MacBook Pro Retina - Mountain Lion.

Can anyone please verify this problem is occurring for them too? Does it look like a bug or am I doing something wrong? Thanks for your help.

1
csssafariwebkithover
what happens when you remove position:relative; & overflow:hidden; ? - Mark
Thanks mark - it works fine if i use position:absolute; - I haven't really looked much for a workaround yet, Ive more been wondering if its a bug that I should report to webkit dev. Cheers. - user1608371

1 Answers

0
votes

try this not sure but hoping for some +ve result

@media screen and (-webkit-min-device-pixel-ratio:0) {
#selector{ background: color; }
}