title: Fullscreen height and width
body: <p>I am trying to get my site background splitted in two colars verticalle. Fullscreen both height and width. What I am doing wrong here ? Hope someone can help. regards </p>
  
  <p>I have a link to the test page <a href="http://www.damtesting.co.nf/" rel="nofollow">here</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
  &lt;title&gt;testing fullscreen&lt;/title&gt;
  &lt;link href="assets/css/style.css" rel="stylesheet" type="text/css" /&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;div id="wrapper"&gt;
  &lt;table id="maintable" border="0" cellspacing="0" cellpadding="0"&gt;
  &lt;tr&gt;
  
  &lt;td id="table1"&gt;How to get this fullscreen height?&lt;/td&gt;
  
  &lt;td id="table2"&gt;
  &lt;div id="logomelonmania"&gt;
  &lt;/div&gt;
  
  &lt;table id="menu-div" &gt;
  &lt;tr&gt;
  
  &lt;/tr&gt; 
  &lt;/table&gt;
  
  &lt;div id="paragraphtext"&gt;&lt;/div&gt;
  &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>@charset "utf-8";
  /* CSS Document */
  
  body {
  margin:0px;
  }
  
  
  tablepage {
  border-spacing: 0;
  border-collapse: collapse;
  }
  
  #table1 {
  background-color: #88b56d;
  width:50%;
  height:100%;
  }
  
  #table2 {
  background-color: #435;
  height:100%;
  width:50%;
  }
  
  #wrapper {
  height:100%;
  }
  
  #maintable {
  height:100%;
  width:100%;
  }
  </code></pre>