css - Multiple divs for a hover, changes color at end of webkit color transition -
i have css file separate main css file page. there 3 hyperlinks each own p tags, 1 under other, , each has own divs specifying webkit transition color when highlight. colors work great until end of webkit transition, @ point 3 links change color color specified in last class on css (gray). tried excluding last class, , sure enough, final color links became color specified in new "last class" (blue).
this happens when have visited link, works fine when clear cookies , don't click on of links. seems a:visited, can see, have covered (i think...).
here's css:
.orangelink a:link:hover,a:hover,a:visited:hover { color: #cc7839; text-decoration:none; /* font-weight:bold; */ -webkit-transition:color 0.5s ease-in; -moz-transition:color 0.5s ease-in; } .bluelink a:link:hover,a:hover,a:visited:hover { color: #7290a4; text-decoration:none; /* font-weight:bold; */ -webkit-transition:color 0.5s ease-in; -moz-transition:color 0.5s ease-in; } .graylink a:link:hover,a:hover,a:visited:hover { color: #b0afaf; text-decoration:none; -webkit-transition:color 0.5s ease-in; -moz-transition:color 0.5s ease-in; }
seems i'm missing small... clear, there no interference main css file, isn't defined @ except color of hyperlinks when inactive.
in declarations, state parent's class of a:link:hover...
.graylink a:link:hover, .graylink a:hover, .graylink a:visited:hover{ color: #b0afaf; text-decoration:none; -webkit-transition:color 0.5s ease-in; -moz-transition:color 0.5s ease-in; }
this make gray behave correctly, same other colors , bingo.
Comments
Post a Comment