Блог

Главная - Вопросы по программированию - Не удается выбрать родственного

Не удается выбрать родственного

#css

#css

Вопрос:

Я пытаюсь использовать селекторы sibling и / или ~ в первый раз:

HTML

 <div id="social">
    <div class="wrap">
        <div class="follow">Follow us on Twitter</div>
        <img src="images/twitter.png">
    </div>
</div>

CSS

 header #social .wrap .follow {  
    display: none;
}

header #social img:hover ~ .follow{
    display: block
}

В принципе, по умолчанию сообщение в .follow не отображается. Я бы хотел, чтобы он появлялся, когда пользователь наводит курсор на изображение. Я пробовал ~ (выше), а также .

Ответ №1:

Sibling должен отображаться после элемента, т.е.

 <img src="images/twitter.png">
<div class="follow">Follow us on Twitter</div>

http://jsfiddle.net/y2AX8/

Комментарии:

1. Классное спасибо! Значит, нет способа выбрать родственного, который появляется раньше?

2. Не с siblings. Конечно, вы можете достичь того, что пытаетесь сделать, ссылаясь на . вместо этого оберните — см.: jsfiddle.net/y2AX8/1

Метки: