Javascript 未应用某些CSS模块样式

我很难使用CSS模块应用我的CSS规则之一

下面是React代码和CSS样式。当应用于锚定时，除

活动

类外，所有规则均有效。我尝试了不同的名称、不同的选择器，但无法使用锚元素（

hover

和

active

伪类工作正常）

从“React”导入React；
从“./NavigationItem.css”导入类；
常量导航项=（道具）=>{
返回(


);
};
导出默认导航项
.NavigationItem{
保证金：0；
框大小：边框框；
显示器：flex；
身高：100%；
对齐项目：居中；
}
.导航项目a{
颜色：白色；
文字装饰：无；
身高：100%；
填充：16px 10px；
边框底部：4px实心透明；
框大小：边框框；
显示：块；
}
.导航项目a：悬停，
.导航项目a：活动
.NavigationItem a.激活{
背景色：#8f5c2c；
边框底部：4px实心#40a4c8；
颜色：白色；
}
此处缺少一个逗号：
。导航项目a:末尾为活动的
。应该是这样的:

.NavigationItem a:hover,
.NavigationItem a:active,
.NavigationItem a.active {
    background-color: #8f5c2c;
    border-bottom: 4px solid #40a4c8;
    color: white;
}

此处缺少一个逗号：
。导航项a:末尾为活动的
。应该是这样的:

.NavigationItem a:hover,
.NavigationItem a:active,
.NavigationItem a.active {
    background-color: #8f5c2c;
    border-bottom: 4px solid #40a4c8;
    color: white;
}

我花了大约一个小时来弄清楚是什么问题，因为那个打字错误：）谢谢。我花了大约一个小时来弄清楚是什么问题，因为那个打字错误：）谢谢。