CodePen CSSが正しく

Question

https://codepen.io/jamesbcn/pen/weYdPw

を表示していない私は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; 
} 

Answer 1

あなたはそれはあなたがあなたのCSSに期待しているものと一致し、他はあなたがCSSクラスとしてnavを処理しているということで同様に1があなたのHTMLのdoesntのを見た構造であること、そこに問題のカップルを持っています（CSS用語の前にピリオドを付けると、ブラウザが、HTML要素<nav>ではなく、<div class='nav'></div>のようなcssクラスと要素を一致させようとしていることを意味します）。

など。

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

はどのように正しく表示されない

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