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*/
 }