html5 布局错乱,HTML5布局和页脚错误

我是新来的HTML5的世界，我想建立一个布局，让我更好地了解如何从HTML4上移动。我当前已建成了布局，但要检查：HTML5布局和页脚错误

如果我的代码编写正确(任何提示或建议将非常感激，因为我第一次在HTML5中我写了这么要确保即时通讯做的事情右)

试图修复页脚坐在页面底部，重叠侧栏和第2部分，但目前它显示在页面中间。

我注意到，当在Firefox浏览网站并使用Firebug时，该网站并未显示出我在CSS中定义的确切尺寸，因此想要了解为什么会这样。

以下是我的代码：

BrightBees Layout

This my Header

My Navigation Bar

My Banners

My SideBar

This is my section1

This is my section2

This is my footer

我的CSS：

body {

background:#FFF;

}

#container {

margin: 0px auto 0px auto;

width:960px;

border:1px solid #CCC;

}

header {

margin:0;

padding:0px;

text-align:center;

height:166px;

}

nav {

height:65px;

text-align:center;

background:#CCC;

}

#banners {

margin:0;

height:253px;

background:#01AEF0;

text-align:center;

}

#sidebar {

height:600px;

width:310px;

background:#ec8400;

float:left;

text-align:center;

}

#content {

height:300px;

width:650px;

background:#CCC;

float:right;

text-align:center;

}

#list {

height:300px;

width:650px;

background:#01AEEF;

float:right;

text-align:center;

}

footer {

margin:0;

padding:0;

text-align:center;

font-weight:bold;

height:167px;

background:#efefef;

z-index:-1px;

text-align:center;

}

预先感谢看着这一点，任何建议将不胜感激。

+0

'z-index：-1px'肯定不符合 –