【技术】高度不适应（内层对象高度发生变化时，外层对象的高度不能自动调节）

html部分：

<div class="box2">上</div>
<div id="box">
<p>内容<br>内容<br>内容<br>内容<br>内容<br>内容</p>
</div>
<div class="box2">下</div>

css部分：

.box2{
　　background-color: #ccc;
}
#box{
　　background-color: #eee;
}
#box p{
　　margin: 20px 0;
　　text-align: center;
}

注：对1px间距没有要求的时候用法一、法二，要求严格用法三

法一：

#box{
　　background-color: #eee;
　　border: 1px solid #fff;/*添加代码*/
}

法二：

#box{
　　background-color: #eee;
　　padding: 1px 0;/*添加代码*/
}

法三：

html部分：

<div class="box2">上</div>
<div id="box">
　　<div class="clear-div"></div>
　　<p>内容<br>内容<br>内容<br>内容<br>内容<br>内容</p>
　　<div class="clear-div"></div>
</div>
<div class="box2">下</div>

css部分：

.box2{
　　background-color: #ccc;
}
#box{
　　background-color: #eee;
}
#box p{
　　margin: 20px 0;
　　text-align: center;
}
.clear-div{
　　height: 0;
　　overflow: hidden;
}