Html 为什么这个菜单会在Chrome中移动？

我正在创建一个页面（链接如下），并使用HTML5标记，

nav

。但是，如果在Google Chrome中调整了窗口的大小，菜单将跳转到

div.banner

下方

为什么会发生这种情况？我如何修复它

这是我正在设计的页面：

CSS

将以下css样式添加到第71行和第343行的a.brand中

a.brand {
display: block;
float: left;
}

在第125行和第397行的标题中添加以下css样式

header{
 clear:both;
}

---

我认为这会对你有用：

在线-363：

            nav {
    height: 50px;
    width: 400px; /* 5x the length of each nav item */
position:absolute;     /* use positioning rather than "float:right;" */
top:0px;
right:0px;
    padding: 0;
    margin: 0;
    color: #004824;
    background: #fff;
    vertical-align: middle;
} 

在线-331：

        div.banner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    margin: 0;
    padding: 0;
    z-index: 2;        /* change z-index so img will be on top */
    border-bottom: 1px solid #004824;
}

下面是一个可能有助于演示的示例