При наведении на ссылку вывести иконку

[efendi]

Ребята, помогите пожалуйста реализовать на практике следующее.

Есть горизонтальное меню со списком, состоящих из ссылок:

 

Затрудняюсь задать код псевдокласса hover, чтобы при наведении на ссылку из меню, снизу появлялось следующее изображение.

 

HTML:

<div class="topmenu">			<ul>			<li><a href="#">Главная</a></li>			<li><a href="#">О сайте</a></li>			<li><a href="#">Контакты</a></li>			<li><a href="#">Новинки</a></li>			<li><a href="#">Добавить в избранное</a></li>			</ul></div>

CSS:

.topmenu {	position: absolute;	top: 200px;	left: 180px;	display: inline-block;	}.topmenu a {	color: #fff;	text-decoration: none;}.topmenu a:hover {	color: #FFC300;}.topmenu li {	display: inline;	margin: 0 10px;}

Очень буду благодарен за оказание помощи!

[Galaxy]

ну идея такая http://jsfiddle.net/2U9g4/ , только спозиционировать абсолютом потом хрень которая снизу.

[efendi]

ну идея такая http://jsfiddle.net/2U9g4/ , только спозиционировать абсолютом потом хрень которая снизу.

Спасибо! Но не совсем так. При наведении на ссылку из меню, правая его часть смещается вниз(((

[Galaxy]

:after надо спозиционировать абсолютом

[efendi]

:after надо спозиционировать абсолютом

Не помогает(((

Подставил на бэкграунд картинку. Теперь при наведении вообще ничего не выводится(((

.topmenu li a:after{    content:'';    display:none;    height:10px;    width:10px;    background:url('../images/link.png');	position: absolute;	top: 30px;	left: 30px;}

[Galaxy]

http://jsfiddle.net/2U9g4/1/ 

[efendi]

http://jsfiddle.net/2U9g4/1/ 

Error 404

We're truly sorry, but there is no such page

 

Вот картинка, которую нужно выводить под каждой ссылкой (снизу) из меню.

Уже всё поправил, и картинка выводится. Единственное, что при наведении на любую ссылку из меню, картинка выводится всегда в одном месте. А нужно, чтобы выводилась под ссылкой, на которую наводишь курсор.

Edited May 17, 2014 by efendi

[Galaxy]

http://jsfiddle.net/2U9g4/3/ ширину правильно напишите только,

[efendi]

http://jsfiddle.net/2U9g4/3/ ширину правильно напишите только,

Да, спасибо большое!

Уже всё выводится.

Теперь всё гуд!

От всей души спасибо вам, что уделили время!

Edited May 17, 2014 by efendi

[Galaxy]

position relative родителю давать надо

[efendi]

position relative родителю давать надо

Да-да, я сразу не заметил в вашем коде. Прошу прощения!

Благодарю вас!

[Galaxy]

не за что. удачи