Всем привет!
Имеется:
<div class="class1">
<div class="class2">123</div>
<input type="text" class="class3">
</div>
Задача:
.class3:hover -> .class2 {color: red;}
Пробовал варианты, но если я правильно понял, они выбирают лишь элемент ПОСЛЕ, а не ДО:
.class3:hover + .class2 {color: red;}
.class3:hover ~ .class2 {color: red;}
Через js это реализовать не проблема, но может можно обойтись средствами css?
Спасибо!
UPD: если подробнее, то пытаюсь сделать подсветку иконки при hover input в bootstrap, а именно
здесь:
<label class="sr-only" for="inlineFormInputGroupUsername2">Username</label>
<div class="input-group mb-2 mr-sm-2 mb-sm-0">
<div class="input-group-addon">@</div> // иконка
<input type="text" class="form-control" id="inlineFormInputGroupUsername2" placeholder="Username"> // при hover -> меняем цвет иконки
</div>