title: Show a default hidden <tbody> in table when button clicked
body: <p>I like to create a simple table with has a default hidden tbody, so when i click a button. It will be display in align with my thead.</p>
  
  <p>Here's my html</p>
  
  <pre><code>    &lt;div id="show"&gt;
          &lt;table&gt;
              &lt;thead&gt;
                  &lt;tr&gt;
                      &lt;th&gt;Name&lt;/th&gt;
                      &lt;th&gt;Item Name&lt;/th&gt;
                      &lt;th&gt;Item Price&lt;/th&gt;
                  &lt;/tr&gt;
              &lt;/thead&gt;
              &lt;tbody&gt;
                  &lt;tr&gt;
                      &lt;td&gt;Alvin&lt;/td&gt;
                      &lt;td&gt;Eclair&lt;/td&gt;
                      &lt;td&gt;$0.87&lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/tbody&gt;
          &lt;/table&gt;
      &lt;/div&gt;
  
      &lt;a href="#show"&gt;Show table body&lt;/a&gt;
  </code></pre>
  
  <p>And CSS</p>
  
  <pre><code>    &lt;style type="text/css"&gt;
          #show:target tbody td{
              display: inline-block;
          }
          table {
              border-collapse:collapse;
          }
          tbody td{
              display: none;
          }
       &lt;/style&gt;
  </code></pre>