Как сделать затемнение блока?
Всем привет, есть блоки, и как по очереди их затемнять, дело в том что они стоят в притык и ховером у меня не получается сделать, может кто поможет
Ответы (2 шт):
Автор решения: Александр
→ Ссылка
.elem {
color: red;
background: yellow;
display: inline-block;
width: 50px;
text-align: center;
border: 1px solid #000;
}
.items:hover .elem:not(:hover) {
background: green;
color: #FFF;
}
<div class="items">
<li class="elem">1</li>
<li class="elem">2</li>
<li class="elem">3</li>
<li class="elem">4</li>
</div>
Используйте :not(:hover) Логика такая - слушаем весь список и применяем стили только к тем элементам, которые не имеют :hover