今天在做界面布局的时候发现了一个问题，就是自己做高级检索 需要用到左中右布局，自己做了下，发现问题。。。不是自己想的样子。导致内容溢出了
效果可以参看当当的筛选
正确的解决方案代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{
margin: 0px; padding: 0px;}
.l,.r{
width: 100px; height: 100px; background-color: red; margin: 0px;}
.l{
float:left;}
.r{
float: right;}
.c{
background-color: yellow; height: 400px; margin:0 100px;}
</style>
</head>
<body>
<div class="nav">
<div class="l">左边</div>
<div class="r">右边</div>
<div class="c" >中间 </div>
</div>
</body>
</html>
效果图：
哎： 核心解决思想为：把中间的内容让其不溢出 ，这里我们用了最优效果的盒子模型属性margin