在悬停按钮内更改字体图标颜色

Question

在我的网站页面（开发中）http://www.stefaanoyen.be中，有3个按钮，文本前面有一个箭头。箭头是一个图标字体，我希望它在按钮悬停时改变颜色（按钮文本也是如此）。

知道怎么做吗？

这是我的HTML：

<a class="footerbutton"><span class="footerlist">X</span>Vraag offerte</a>

这是按钮：hover css：

a:hover.footerbutton {
background-color: #B61618;
color: #ddd;
border: none;
text-decoration: none;
}

这是footerlist span class css：

.footerlist:hover {
color: #ddd;
 }

Answer 1

在悬停按钮内定位图标颜色的最简单方法是将其定位为：

.footerButton:hover .footerlist {
   color: #ddd;
}

Answer 2

这应该有效：

a:hover.footerbutton:hover .footerlist {
    color: #ddd;
}