Как сделать, чтобы квадраты пропадали при наведении?

Question

[fruneen]

Привет всем! Как мне сделать, чтобы при наведении мыши на серые квадраты они перекрашивались в белый, я сделал через :hover, но при наведении на букву, ничего не происходит, так как буква выше квадратов. Как мне сделать, чтобы квадраты перекрашивались даже при наведении на букву?

Comments

[Рома Зварич]

Разместите фрагмент кода на https://codepen.io/pen/, чтобы можно было на Вашем примере поискать решение

Answer 1

[profesor08]

.буква {
  pointer-events: none;
}

Answer 2

[Narts]

Вы вероятно :hover ловили у самих квадратов.
Попробуйте ориентироваться на :hover родительского элемента:

<div class="block">
      <span>S</span>
      <div class="squares"></div>
</div>

.block:hover .squares{
      opacity: 0;
}