Css 引导导航栏中的材质图标未正确对齐

使用导航栏中的引导4和材质图标，图标未正确对齐

你可以在这把小提琴上看到

您可以使用css

垂直对齐来解决此问题。我建议应用于所有材质图标

.material-icons {
  vertical-align: middle;
}

或者，您可以使用
marginright:5px
获得更多的喘息空间

请看小提琴：
只需将此代码添加到您的代码中即可

a.nav-link {
    display: flex;
    align-items: center;
}

这是您的代码的工作代码笔
 我建议您在使用Bootstrap时使用字体很棒的图标，而不是具体化。如果您使用club material和bootstrap，css将出现一些问题。您在这里所做的只是修复这个特定的标记和类。真正的问题是在使用材质图标时，代码的其他位置仍然存在。