[Solved] How do I make a header above my navigation bar?

by


I have Changed Your Code A bit and it’s working fine Now. tested in Chrome

HTML

<body>
<header role="banner" id="top">
<div id="header-text">
    <h1><strong id="top-title">Atlas Land Office (text will change)</strong></h1>
    <p id="slogan">Keeping lands fresh.</p>
</div>

<div id="menu">
     <ul role="navigation" class="banner">
           <li><a href="#home">Home</a> </li>
           <li><a href="#land">Land Surveying</a></li>
           <li id="nav-space-left"><a href="#civil">Civil Engineering</a></li>
           <li id="nav-home"><a href="#top" title="Back to top"><img src="#logo" alt="Atlas Land Office"></a></li>
           <li><a href="#planning">Land Planning</a></li>
           <li><a href="#company">Company</a></li>
           <li><a href="#careers">Careers</a></li>
    </ul>
   </div>
</header>
</body>

CSS

 body {
 height: 3000px;
 top: 0;
 position: relative;
   }
 #header-text{
  height:200px;
  border:2px solid;     
 }
 #menu {
display:block;
  }
 #menu ul {
width:1000px;
background-color:#666;
border:1px solid;
height:30px;
 }
 #menu ul li{
float:left;
padding:5px;
list-style:none;
 }
 #menu ul li a{
color:white;
text-decoration:none
 }
 .fixnav{
position:fixed;
top:0;
z-index:1000;   
 }

JQUERY

  $(window).scroll(function ()

    {     
        if ( $(window).scrollTop() > 200)
        {
            $("#menu").addClass("fixnav");
        }
        else  if ($(window).scrollTop() < 200)
        {
            $("#menu").removeClass("fixnav");
        }
    });

1

solved How do I make a header above my navigation bar?