相信小伙伴们经常会遇到这个问题，我也是填了很多坑，查了很多资料，才解决的，下面我列出2个方法：
我们的需求如图：
1：（这个方法不推荐使用，因为可能会因为设备不同，而出现未知BUG，特别是div出现padding的时候）
<div class="main"> <div class="title"></div> <div class="content"></div> </div>
.main{width: 100%;height: 100%;}
.title{
width: 100%;
height: 80px;
background: #29f0bf;
}
.content{
padding: 0 32px;
position: absolute;
width:calc(100% - 64px);
height: calc(100% - 80px);
background: #f09529;
}
2：（推荐使用该方法）
<div class="main"> <div class="title"></div> <div class="content">sddfsfsdf15646</div> </div>
.main{width: 100%;height: 100%;}
.title{
width: 100%;
height: 80px;
background: #29f0bf;
}
.content{
padding: 0 32px;
width: calc(100% - 64px);
position: absolute;
top: 80px;
bottom: 0px;
left: 0px;
background: #f09529;
}
***************************************** END ***************************************************
原文：https://www.cnblogs.com/silent007/p/8778487.html