Safari :hover bug on overflowed element containing floats

Description

Safari (only tested 2.0.3) fires :hover outside the borders of an overflowe:d element if it's containing floating element. The :hover will trigger outside the element on Safari. Neither MSIE6 or Firefox has this bug.
If you don't have Safari, you can watch a movie of the bug here.

Workaround (ugly)

I found a workaround if the floating element(s) are followed by an inline element and then a block element (in that order), the bug wont trigger, as seen in example (B). This isn't a really nice fix but works'

A

 
h

B

 
.


/* CSS */
#test,#workaround {
	overflow: auto;
	background-color: silver;
	margin: 25px;
	padding: 25px;
	width: 250px;
	height: 250px;
}

#test:hover, #workaround:hover {background-color: gray;}

#test div, #workaround div {
	background: yellow;
	float: left;
	margin: 7px;
	width: 900px;
	height: 900px;
}

#test div:hover, #workaround div:hover {background: orange;}

.safarifix {position: relative; left: -100px;} /* Hide it */


<!-- HTML -->
<div id="test">
    <div>&nbsp;</div>
</div>

<div id="workaround">
	<div>&nbsp;</div>
	<span class="safarifix">.</span>
	<p class="safarifix"></p>
</div>

--
Martin at burnfield dot com, http://burnfield.com/martin