Как повернуть элемент в меню при наведении?

Question

[buzzloud]

Друзья, есть горизонтальное двух-уровневое меню, которое размечено обычным списком. В этом меню есть графический элемент - стрелка, которая сейчас там находится с помощью свойства background-image. Задача сделать так, чтобы она (стрелка) разворачивалась вниз при наведении курсора на пункт меню. Сделать нужно силами CSS.

Как? Понятно, что нужно использовать transform: rotate; Но как быть со стрелкой, добавлять её в список ещё одним тегом? Посоветуйте)

Answer 1

[Даниил Игоревич]

li::before{
background-image: ...
}
li:hover::before{
transform: rotate(-90deg);
}

Comments

[Zhainar]

еще transition: all .3s; для красоты

[Михаил Дудар]

Zhainar: ну и вендорых префиксов для кроссбраузерности )

[buzzloud]

Спасибо, все отлично)