title: Adding header footer and content to split layout
body: <p>I would like to add a header and footer to this split layout like that:
  <a href="http://i.stack.imgur.com/MGysn.png" rel="nofollow">pic1</a></p>
  
  <p>When I add this code:</p>
  
  <pre><code>&lt;style type="text/css"&gt;
  body {
  margin:0;
  padding:0;
  }
  div#header{
  width:100%;
  height:65px;
  position:fixed;
  z-index:100;
  background-color:#F00;
   } 
  
  div#footer{
  width:100%;
  height:65px;
  position:fixed;
  bottom:0;
  background-color:#06F;
  }
  div#content{
  background-color:#111;
  width:100%;
  height:100%;
  position:absolute;
      }
  &lt;/style&gt;
  &lt;body&gt;
  &lt;div id="container"&gt;
      &lt;div id="header"&gt;
          &lt;?php include 's/header.php';?&gt;
      &lt;/div&gt;
      &lt;div id="content"&gt;
      &lt;?php include 'index.html';?&gt;
      &lt;/div&gt;
      &lt;div id="footer"&gt;
          &lt;?php include 's/footer.php';?&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I have header and footer only after I clicked not in the split screen:
  <a href="http://i.stack.imgur.com/FQXGo.png" rel="nofollow">pic2</a></p>