前端HTML布局居中问题心得记录

父级元素不用加position:relative;
子元素不用加position:absolute;
将父级元素传到子元素即可。
比如：

//父级元素：
.menubar{
    height: 80px;
    width: 100%;
    z-index:100;
    /*position: relative;*/
}

//子元素：
.menubar #navmenu {
    /*position: absolute;*/
    width: 880px;
    margin: 0 auto;
    height: 80px;
    line-height:80px;
    z-index:100;
    font-size: 20px;
}

这样就实现了子布局相对父布局居中，注意这是对大部分浏览器的样式设计情况。还有一些浏览器可能用margin:0 auto;会是靠左显示或者靠右显示。