Не могу применить стили другому классу при помощи :hover

Question

Не могу применить стили другому классу при помощи :hover

Рейтинг: 1Ответов: 2Опубликовано: 13.04.2023

Допустим я хочу поменять цвет блока при наведении на ссылку, но почему то ничего не работает. Видел видео где в стилях не было + между .link:hover и .block и все нормально работало

<body>
        <a href="#" class="link">Link</a>
        <div class="block"></div>
</body>

CSS styles

.block {
    width: 100px;
    height: 100px;
}

.link:hover .block {
    background: red;
}

css html

Источник: Stack Overflow на русском

Answer 1

▲ 0Принят

.block {
    background-color: black;
    width: 100px;
    height: 100px;
}

.link:hover + .block {
    background: red;
}

<a href="#" class="link">Link</a>
<div class="block"></div>

Answer 2

▲ 0

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

Как вариант...

.block {
  width: 100px;
  height: 100px;
}

.link:hover + .block {
  background: red;
}

<body>
  <a href="#" class="link">Link</a>
  <div class="block"></div>
</body>

Не могу применить стили другому классу при помощи :hover

Ответы