标签：
在css导航的制作中，出现个问题，以前做的导航都是左右对称的，只要利用margin:0 auto;就可以实现居中。但这次的图片模板中导航的左边宽，右边窄，如果都当成背景来布局，一眼会感觉这个导航没有在中间。
为了让其视觉上logo和导航菜单所在的白色区域居中，就要用相对定位和绝对定位了。
left-side.png
right-side.png
Html的代码如下：
<div id="msg"> <div class="left-side"></div> <div class="right-side"></div> 。。。。。。 </div><!--msg end-->
Css代码如下：
#msg{ float:left; width:100%; height:130px; margin-left:-18px;/*相对于原来的位置改变*/ position:relative; background-color:#fff; } .left-side{ position:absolute;/*相对于父级改变，在此父级为msg*/ left:-90px; background-image:url(images/left-side.png); background-repeat:no-repeat; width:90px; height:130px; } .right-side{ position:absolute; right:-70px; background-image:url(images/right-side.png); background-repeat:no-repeat; width:70px; height:130px; }
标签：
原文地址：http://www.cnblogs.com/hyfhxz/p/4883786.html
