title: How to represent a binary tree with tables (html)?
body: <p>Here is a brain-teaser for the brave. I've been at it for days and just can't come with the solution.</p>
  
  <p>I wanted to come out with something like this:</p>
  
  <p><img src="https://i.stack.imgur.com/9bqyV.jpg" alt="enter image description here"></p>
  
  <p>Using html, CSS and PHP only.</p>
  
  <p>I got near, but not quite what I expected. <a href="http://ideone.com/JmhHB" rel="nofollow noreferrer">Here is the code in PHP</a> and <a href="http://jsfiddle.net/naoise/u5fFk/show/" rel="nofollow noreferrer">here is the output</a>.</p>
  
  <pre><code>&lt;table border="0"&gt;
  &lt;thead&gt;
      &lt;tr&gt;
          &lt;th&gt;Cientoveintiochavos&lt;/th&gt;
          &lt;th&gt;Seseintaicuatravos&lt;/th&gt;
          &lt;th&gt;Treintaidosavos&lt;/th&gt;
          &lt;th&gt;Dieciseisavos&lt;/th&gt;
          &lt;th&gt;Octavos&lt;/th&gt;
          &lt;th&gt;Cuartos&lt;/th&gt;
          &lt;th&gt;Semifinales&lt;/th&gt;
          &lt;th&gt;Final&lt;/th&gt;
      &lt;/tr&gt;
  &lt;/thead&gt;
  &lt;tbody&gt;
  &lt;?php for($i=0;$i&lt;256;$i++): ?&gt;
      &lt;tr&gt;
          &lt;?php for($n=0,$c=2;$n&lt;8;$n++,$c*=2): ?&gt;
              &lt;?php 
              /*
              if(false){//$i == 0) {
                  $rwspn = $c/2+1; 
                  $iter = 0;
              } else {
                  $rwspn = $c; 
                  $iter = $c;//-$c/2+1;
              } 
              */
              $class = ($i%($c*2))?'par':'impar winner';
              if($i%$c==0):?&gt;
                  &lt;td rowspan="&lt;?=$c;?&gt;" class="&lt;?=$class;?&gt;"&gt;&lt;span&gt;&lt;?php echo genRandomString();?&gt;&lt;/span&gt;&lt;/td&gt;
              &lt;?php endif; ?&gt;
          &lt;?php endfor; ?&gt;
      &lt;/tr&gt;   
  &lt;?php endfor; ?&gt;
  &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>If someone knows how to represent a binary tree or a dendrogram or comes up with a smarter code please let me know! </p>