Не работают три последних :hover в списке

Question

Имеется следующий кусок кода в HTML и его стилизация на CSS:

.footer__social {
    display: inline-block;
}

.footer__fb:hover {color: #09a3f0};
.footer__tw:hover {color: #a4dcf8};
.footer__ins:hover {color: #e53e28};
.footer__drib:hover {color: #df7e44};

<div class="footer__social">
    <ul class="social__list">
        <li><a class="footer__fb" href="#">Facebook</a></li>
        <li><a class="footer__tw" href="#">Twitter</a></li>
        <li><a class="footer__ins" href="#">Instagram</a></li>
        <li><a class="footer__drib" href="#">Dribble</a></li>
    </ul>
</div>

Проблема в том, что первый hover прекрасно работает, а оставшиеся три последних нет. Вроде уже все перепроверил по 10 раз, не пойму в чем причина.

Answer 1

лишнее в css просто не суйте :) (я про ;)

.footer__social {
    display: inline-block;
}

.footer__fb:hover {color: #09a3f0;}
.footer__tw:hover {color: #a4dcf8;}
.footer__ins:hover {color: #e53e28;}
.footer__drib:hover {color: #df7e44;}

<div class="footer__social">
    <ul class="social__list">
        <li><a class="footer__fb" href="#">Facebook</a></li>
        <li><a class="footer__tw" href="#">Twitter</a></li>
        <li><a class="footer__ins" href="#">Instagram</a></li>
        <li><a class="footer__drib" href="#">Dribble</a></li>
    </ul>
</div>

БЛОГ НА HUSL

Не работают три последних :hover в списке

Ответы (1 шт):