<table class="tablesorter">
  <colgroup>
    <col width="85" />
    <col width="250" />
    <col width="100" />
    <col width="90" />
    <col width="70" />
  </colgroup>
  <thead>
    <tr>
      <th>Order #</th>
      <th>Customer</th>
      <th>PO</th>
      <th>Date</th>
      <th>Total</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td rowspan="2"> <!-- rowspan="2" makes the table look nicer -->
        <a href="#" class="toggle">SO71774</a> <!-- link to toggle view of the child row -->
      </td>
      <td>Good Toys</td>
      <td>PO348186287</td>
      <td>Jul 20, 2007</td>
      <td>$972.78</td>
    </tr>
    <tr class="expand-child">
      <td colspan="4">
        <div class="bold">Shipping Address</div>
        <div>99700 Bell Road<br>Auburn, California 95603</div>
      </td>
    </tr>
    <tr>
      <td rowspan="2"> <!-- rowspan="2" makes the table look nicer -->
        <a href="#" class="toggle">SO71775</a> <!-- link to toggle view of the child row -->
      </td>
      <td>Cycle Clearance</td>
      <td>PO58159451</td>
      <td>May 6, 2007</td>
      <td>$2,313.13</td>
    </tr>
    <tr class="expand-child">
      <td colspan="4">
        <div class="bold">Shipping Address</div>
        <div>2255 254th Avenue Se<br>Albany, Oregon 97321</div>
      </td>
    </tr>

    <!-- View page source for complete HTML markup -->

  </tbody>
</table>

<div id="pager" class="pager">
  <form>
    <input type="button" value="&lt;&lt;" class="first" />
    <input type="button" value="&lt;" class="prev" />
    <input type="text" class="pagedisplay"/>
    <input type="button" value="&gt;" class="next" />
    <input type="button" value="&gt;&gt;" class="last" />
    <select class="pagesize">
      <option selected="selected"  value="10">10</option>
      <option value="20">20</option>
      <option value="30">30</option>
      <option value="40">40</option>
    </select>
  </form>
</div>