代码笔CSS未正确显示

我试图复制并粘贴一个导航栏，我正在将其粘贴到CodePen中，但是CSS没有正确显示

.navbar-brand {
  padding: 0px;
  height: 90px;
}
.navbar-brand>img {
  height: 100%;
  padding: 5px 15px 5px 5px;
  width: auto;
  margin: center;
}
.nav >li >a {
  margin-top: 0;
}

.nav ul{
    display: flex;
    background-color: #C2A76F;
    list-style-type: none;
    padding: 0;
}

.nav ul a{
    text-decoration: none;
    text-align: center;
    color: #FFF;
    display: block;
    padding: 5px;
    border: 2px solid white;
}

.nav ul a:hover{
    background-color: #816F4A;
}

.nav li{
    flex: 1 1 0;
}

p{
    padding-top: 10px;
    font-size: 20px;
}

---

这里有几个问题，一个是HTML中的结构看起来与CSS中的预期不匹配，另一个是将

nav

视为CSS类，而不是元素（在css术语前面加句号意味着浏览器试图将元素与css类（如

）相匹配，而不是HTML元素

）

例如

应该是

nav >li >a {
  margin-top: 0;
}

---

如何正确显示？您希望看到什么？请提供一个更好的描述性问题，说明您面临的问题、您希望实现的目标等。感谢专家。我想您在我删除css时查看了代码。请再次单击，您将看到css未显示。是的，我意外删除了“nav”从同一分区中删除角度相关代码时的类标记。感谢您发现了这一点。

nav >li >a {
  margin-top: 0;
}