В хроме transition некорректно обрабатывается - сначала отрабатывается переход текста и только потом начинает запускаться переход цвета иконки. Как это исправить и где можно почитать про "физику" данного процесса?
есть CSS свойства которые унаследуют от родителя, а есть которые не могут быть унаследованы.
В данном примере это transition который вы прописали к родителю.
В итоге ваша иконка меняет цвет плавно в течении 0.3 сек, а текст срабатывает моментально.
Самой задержки у вас нет, просто одному елементу вы указали плавное изменение, а другому нет.
И текст и иконка меняется плавно, только сначала текст, а потом иконка. И так происходит только в хром, в файрфокс переход срабатывает сразу и для текста и для иконки.
Свойство transition прописано родителю и иконке.
lamer350, остроумно, только вы не привели решения проблемы.
То, что вы написали в первом комментарии - не верно, конкретно:
"а текст срабатывает моментально" - нет, текст не срабатывает моментально, переход 0.3s на iconText
"Самой задержки у вас нет" - задержка есть, как на иконке, так и на всём блоке целиком
Dubrovin, вы не знаете основ, отсюда и такой вывод. То что хром пытается это как то отрендить - не значит что вы делает что то правильно. От того что вам напишут решение - умнее вы не станете, вы даже спорите о том где спора быть не может, просто прочитать про унаследованость и делов то.
lamer350, уж поверьте, я знаю более чем достаточно (уверены ли вы, что вопрос так прост как вам кажется?) Вопрос остаётся открытым - почему хром делает задержку в перерисовке, а файрфокс не делает её и как исправить данную проблему.
