position:absolute与position:relative;相结合作用的理解:是托离文档，不占空间

<style><!--

#nav .wrap{text-align:center;position:relative;padding-top:37px;cursor:pointer;float:left;width:52px;margin:28px 5px 0}
#nav .nav{height:57px;background-image:url(navs.png);border:1px solid red;}
#nav .mouseon{position:absolute;z-index:100;padding-top:37px;width:52px;left:0;color: #FFF;border:1px solid red;}
--></style>
<div class="wrap">
<div id="mouseon1" class="mouseon">首页</div>
<div id="nav1" class="nav"></div>
</div>

上面由于。mouseon中的position:absolute;导致div.mouseon不占.wrap(当然要用position:relative;)的一行，所以内部的两个DIV是重叠的，如图注意红色边框,两个是重叠的

 

若去掉position:absolute;分开.