absolute之整体布局实现

Question

要实现如图的布局，我最先想到是将header与footer绝对定位，但是发现在移动端会出现bug，经查资料发现用absolute实现整体布局非常好，还挺简单的。

.header, .footer, .content { 
      position: absolute; 
      left: 0; 
      right: 0; 
}.header {
    height: 48px; 
    top: 0; 
    z-index: 1; 
   /*other style*/  }.footer { 
    height: 52px; 
    bottom: 0;
    z-index: 1; 
    /*other style*/  }.content { 
    top: 48px; 
    bottom: 53px; 
    overflow: auto; 
   /*other style*/ 
 }