общий ховер картинки и текста

[Lordbl4]

допустим, есть код кнопки "выход" на форуме и перед ним вставлена картинка 

<li><a href="{parse url="app=core&amp;module=global&amp;section=login&amp;do=logout&amp;k={$this->member->form_hash}" base="public"}" title='{$this->lang->words['log_out']}'><img src="{$this->settings['img_url']}/icons/s-out.png" class='iconexit' alt='' />&nbsp;{$this->lang->words['log_out']}</a></li>

 

 

класс iconexit прописан следующим образом 

 

.iconexit {
margin-left: 0px;
margin-top: -1px;
opacity: 0.8;
}

.iconexit:hover {
opacity: 1.0;
}

для текста кнопки "выход" применяются следющие параметры

 

#user_navigation a { color: #ACB5C3; }
#user_navigation a:hover { color: #E8ECF3; }

при наведении на иконку срабатывает ховер и для иконки и для текста

но при наведении на текст срабатывает ховер только для текста

собственно, как сделать чтобы ховер срабатывал в обоих случаях одинаково?

я не специалист html & css и возможно не правильно всё делаю...

[spoken]

Лучше кусок итогового HTML приведи, чтобы было видно, что и как.

[Lordbl4]

итогового HTML

в смысле? из браузера выдрать чтоли?)

//upd

добавил этот же класс для кнопки входа. ссылка в профиле, принцип работы виден

[Lordbl4]

подниму тему. ссылка на форум есть в профиле, если нужно для входа - test111 111222333

достаточно понаводить курсор на иконку выхода и на текст "выход" или же на имя пользователя и на его картинку в самом верху на главной

[LvsF]

Переместите из кода изображения Ваш новый класс в код ссылки.

[Lordbl4]

Переместите из кода изображения Ваш новый класс в код ссылки.

к примеру у картинки выставлена тень при наведении курсора (hover), у текста тоже вылезет тень вокруг,

или же ховер текста реализован изменением цвета, а ховер картинки - c помощью opacity

 

разве не перепутается всё?

[StickyBrain]

Попробуйте эффект hover для картинки реализовать в css немного иначе:

#user_navigation a:hover .icontext {opacity:1.0;}

Поскольку картинка лежит внутри тэга ссылки, должно сработать.

[Lordbl4]

Попробуйте эффект hover для картинки реализовать в css немного иначе:

#user_navigation a:hover .icontext {opacity:1.0;}

Поскольку картинка лежит внутри тэга ссылки, должно сработать.

 

не получилось 

[StickyBrain]

не получилось 

 

Подозрительно. Перепроверил у себя - срабатывает. Дико извиняюсь, я в коде в названии класса картинки ошибся, начирикал .icontext вместо .iconexit, может заковыка в этом?

[Lordbl4]

Подозрительно. Перепроверил у себя - срабатывает. Дико извиняюсь, я в коде в названии класса картинки ошибся, начирикал .icontext вместо .iconexit, может заковыка в этом?

да... у самого голова перед праздниками не соображает(

 

всё отлично, спасибо большое!