------------------------------------------
<style type="text/css">
*{margin:0;padding:0;}
.wrap div{float:left;height:400px;}
.wrap {overflow:hidden;_zoom:1;}
.content{width:60%;background:gray;}
.nav{width:20%;background:orange;margin-left:-20%;}
.infor{width:19%;background:green;}
</style>
<body>
<div class="wrap">
<div class="content">aaaaa</div>
<div class="nav">bbbbb</div>
<div class="infor">ccccc</div>
</div>
</body>----------------------------------------
从结构可以看出一个大的父包含框里有三个液态子块，css样式将这些子块向左浮动。在给出计算方法之前，我们需要做一个实验，给导航nav增添一个属性margin-left:20%;这时，我们通过浏览器的显示结果可以知道c模块也就是infor被挤到了下一行显示。再做个对比实验。在原始代码中，把c模块向左移动19%，也就是在infor中添加margin-left:-19%;的属性，浏览器这时会显示c模块覆盖在了b上，但是b和a的位置都没有发生移动。
以上的解释，我们来实现一个bac的布局。我们需要花费很小的移动代价，以尽量少地影响其它模块的位置为前提来布局。我们需要让a模块为b预留相应的宽度位置，b的宽度为20%，所以我们给a增添margin-left:20%;的属性（在本文头部给出的原始未改动的代码中添加）。根据我们实验的结论可知，正边距会使得b和c模块相应的移动，也就是被挤离原来的位置20%，这时b模块要移动到最左边，需要超越a的60%宽度，并加上自己被挤走的20%，使用负边距属性margin-left:-80%;到达预定位置。好了，布局结束。