Question

I am trying to format a table to look like this…

Basically i want the “Dates” row to have two columns inside it (to and from) both of them 50% the width of dates…but however when i try to format it. “To” takes all of date and “From” takes all of Name. they arent locked under “Dates”

Any help will be appreciated…Thank you

                    <th width="100%">Dates</th><th>Name</th><th>Age</th>
         <tr>
  <tr>
    <td width="50%">To</td>
    <td width="50%">From</td>
  </tr>

</tr>

Change

  <table border="1">
                      <tr class="heading"> <td colspan="6">Information</td> </tr >
                   <th width ="15" colspan="2">Dates</th><th> Name</th><th>Age</th>
         <tr>
  <tr>
    <td width="2">From</td>
    <td width="2">To</td>
    <td></td>
    <td></td>  
  </tr>
  <tr>
  <td width="5">
  <input type="text" class="input" name="1fdate" /></td>
     <td width="2">
  <input type="text" class="input" name="1fdate" /></td>

  </tr>


</tr>




                    </table>

Answer 1

I hope this is what you need. You use colspan and rowspan to merge the cells. When you set colspan to “2” in Date cell, it spans the row with two cells (or colums). And you set also rowspan of the cells next to Date to “2” so that they will span the rows taken by whole Date section.

<table width="600" border="0">
  <tr>
    <th width="200" colspan="2" scope="col">Date</th>
    <th width="200" rowspan="2" scope="col">Name</th>
    <th width="200" rowspan="2" scope="col">Age</th>
  </tr>
  <tr>
    <th width="100">To</th>
    <th width="100">From</th>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>