Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS3 color transition not working in Chrome

Tags:

The links in the left menu in this website have a CSS3 transition property of the color, which changes on mouse hover. It's not working in Chrome 16 or 17 (the color change is sudden), whereas other transitions in the website do. It works in Firefox, Opera, and even Safari, which uses webkit like Chrome, so I don't think it might be a problem with my CSS. What then?

Here's my CSS of this part (the full CSS is here):

#menu a { color: gray; transition: color 0.5s; -moz-transition:color 0.5s; /* Firefox 4 */ -webkit-transition:color 0.5s; /* Safari and Chrome */ -o-transition:color 0.5s; /* Opera */ }  #menu a:visited { color: gray; }  #menu a:hover { color: black; } 

UPDATE! Apparently this has probably been fixed in 18 beta. However, if you have encountered this problem, please visit the bug report linked in the accepted answer below and star the issue.

like image 792
Abhranil Das Avatar asked Dec 13 '11 14:12

Abhranil Das


1 Answers

@Nijikokun I can confirm the same thing. :visited links do not transition correctly in Chrome. Hooray. It seems like this is an issue that cropped up in version 16 and never got fixed. There are a few bug reports open on the Chromium site.

http://code.google.com/p/chromium/issues/detail?id=101245&q=visited%20transition&colspec=ID%20Pri%20Mstone%20ReleaseBlock%20Area%20Feature%20Status%20Owner%20Summary

like image 54
Darren Kovalchik Avatar answered Oct 06 '22 07:10

Darren Kovalchik