title: Radio button inside table
body: <p>I have a group of radio button that I put inside table, the code is like this:</p>
  
  <pre><code>&lt;table class="table table-responsive"&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;Courier&lt;/th&gt;
              &lt;th&gt;Service&lt;/th&gt;
          &lt;/tr&gt;
       &lt;/thead&gt;
       &lt;tbody&gt;
          &lt;form&gt;
          &lt;tr&gt;
              &lt;td&gt;
                   &lt;div class="radio"&gt;
                        &lt;label&gt;&lt;input type="radio" name="optradio"&gt;TIKI&lt;/label&gt;
                   &lt;/div&gt;
              &lt;/td&gt;
              &lt;td&gt;
                    Regular Shipping
              &lt;/td&gt;
           &lt;/tr&gt;
           &lt;tr&gt;
               &lt;td&gt;
                   &lt;div class="radio"&gt;
                        &lt;label&gt;&lt;input type="radio" name="optradio"&gt;JNE&lt;/label&gt;
                   &lt;/div&gt;
               &lt;/td&gt;
               &lt;td&gt;
                    Express Shipping
               &lt;/td&gt;
           &lt;/tr&gt;
           &lt;/form&gt;
       &lt;/tbody&gt;
   &lt;/table&gt;
  </code></pre>
  
  <p>When I click on one of Courier cell for example JNE, the button is selected, now I want to the button is selected too when I click on Express Shipping, how can I make it ? and the vertical align of Service column doesn't have same high as Courier column, how to fix it ? I using bootstrap.</p>