Previous Message
Next Message

:hover pseudo-class unusual behavior in Webkit

Sent by Philippe Wittenbergh on 13 February 2009 02:02


On Feb 13, 2009, at 4:59 AM, Scott Glasgow wrote:

> After much experimentation and blind guessing, I modified some code  
> from
> CSSplay (which I will credit in my html once I get this resolved) to  
> make
> small images in a side column enlarge when hovered over. It works  
> great in
> IE7 and FF. I can live with it not working in IE6, and I haven't  
> tried Opera
> yet (just downloaded it) but I found out that Safari and Chrome  
> don't work.
> Error console doesn't show any problems, and the small pics show  
> just fine,
> but there is no zoom feature.
>
> Look at the pics here: http://www.fcphd.org/community.html
> ============
> I checked it out in FF3.0.6, IE7, and Opera 9.something, and the  
> zoom works
> fine in all three. However, it does not work at all in either of the
> Webkit-based browsers. I looked at the markup and the CSS and can't  
> see
> anything wrong, and Firescope's reference shows the :hover pseudo- 
> class as
> fully supported in all versions of Safari.

WebKit based browsers still seem to have a problem changing the  
display property on :hover.

You have 2 options:
1/ remove it:
..zoom:hover {
	...
	/* display:block */ /* <-- remove */
....
}

or
2/ declare the display property in the .zoom ruleset:

..zoom {
	...
	display:block /* <--- add */
....
}


Philippe
---
Philippe Wittenbergh
http://l-c-n.com/





______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread: