<div id="CamadaSuperior" >
<table id="tabela">
   <tr>
   <td></td>
   <td></td>
   <td></td>
   <td></td>
   <td></td>
   <td></td>
    </tr>
   </table>
</div>


<div id="CamadaDoMeio" >
CamadaDoMeio
</div>

<div id="CamadaInferior" >

 <table class="TabelaDaCamadaInferior" border="1">
  <tr><td>Esquerda</td><td>Meio</td><td> Direita</td></tr>
  </table>
  </div>

  <div id="CamadaRodape" >

  </div>
 </body>

html, body{
  height: 100%;
  margin:0;
  padding:0;
}

div{
border:1px solid black;
padding:0;
}

#CamadaSuperior
{
    height: 40%;
}
#CamadaDoMeio
{
    height: 10%;
}
#CamadaInferior
{
    height: 40%;
      padding:0;
}
#CamadaRodape
{
    height: 10%;
      padding:0;
}

 #tabela{
     height:100%;
     table-layout: fixed;
     border-width:1px;
}

 #tabela tr{
     width:50%;
     height:100%;
     border-width:1px;
}

 #tabela tr td{
  width:100%;
   height:16.7%;
}

 .TabelaDaCamadaInferior
    {
        height: 100%;
        width: 100%
    }
    .TabelaDaCamadaInferior tr td
    {
        width:33%;
     }