第一行固定，第二行充满屏幕，使用table，兼容ie8以上

在进行布局的时候会遇见这种需求，第一行固定，第二行充满屏幕，而且第二行超出在第二行出现滚动条，并且第二行中有多列，几列之前可以宽度灵活调整，隐藏一列，其他列的宽度要随之变化，在不用js计算的情况下，纯css实现的方式是：

         <div style="width:100%;height:100%;position:relative;">

             <div style="height:50px!important;width:100%;overflow:hidden;position:absolute;top:0;left:0;background-color:pink;">&nbsp;</div>

             <div style="position:absolute;top:50px;bottom:0;left:0;right:0;">

                 <table style="width:100%;height:100%; table-layout:auto!important;" cellpadding="0" cellspacing="0" border="0">

                     <tr style="width:100%;height:100%;">

                     <td style="width:200px;height:100%;">

                         <div style="width:200px;height:100%;background:pink;">123</div>

                     </td>

                     <td style="height:100%;">

                         <div style="width:100%;height:100%;overflow:auto;">

                            <h1 style="width:300px;height:200px;background-color:hotpink;margin:10px;"></h1>

                            <h1 style="width:300px;height:200px;background-color:hotpink;margin:10px;"></h1>

                            <h1 style="width:300px;height:200px;background-color:hotpink;margin:10px;"></h1>

                            <h1 style="width:300px;height:200px;background-color:hotpink;margin:10px;"></h1>

                            <h1 style="width:300px;height:200px;background-color:hotpink;margin:10px;"></h1>

                            <h1 style="width:300px;height:200px;background-color:hotpink;margin:10px;"></h1>

                            <h1 style="width:300px;height:200px;background-color:hotpink;margin:10px;"></h1>

                         </div>

                     </td>

                  </tr>

              </table>

           </div>

       </div>