css - border-bottom 出现在元素的顶部

Question

我不明白为什么我的底部边框不会出现在我的导航栏下方。在我添加 #topheader 之前，它工作正常，所以我认为这是我的问题。如果是这样，是否有更有效的方法将黑匣子放在最上面？谢谢你的帮助

<header>
<div id="topheader">
<div class="wrapper">
<div id="logo">
    <h1>TheWay</h1>
</div>
</div>
</div>


 <!--  Navigation Bar -->

 <div class="wrapper">

 <div id="nav_bar">

 <nav>

 <a href="home.html">Home</a> 

 <a href="blog.html">Blog</a> 

 <a href="music.html">Music</a> 

 <a href="events.html">Events</a> 

 <a href="contact.html">Contact</a>
 </nav>
  </div>
</div>
 </header>

完整代码如下: http://tinker.io/a31d6/2

Answer 1

我在您的示例中根本看不到底部边框，但假设您将其添加到#nav_bar，请尝试添加一个 overflow: hidden 到您的#nav_bar。希望这会做你想做的事。