When there are two :hover pseudo-classes at play--one for an element's :hover styles and another for a child element's pseudo-element hover styles (see example below)--the transition on the pseudo-element seems to have an erratic delay: parent:hover {} parent:hover child::after {} Removing the initial parent:hover {} styles seem to rectify this issue and cause the pseudo-element's transition to run immediately as expected. Here's a JSFiddle demo that runs transitions concurrently in Firefox, IE11, even Safari 5.1.7, but has a delay in Chrome: https://jsfiddle.net/vzpbuk62/3/