Leonid
Leonid

Reputation: 340

dividing a column in an already arranged table HTML CSS

I already have a properly formatted table with a tbody thoroughly arranged with the theads. however I missed something. in a name column in the tbody, i need to divide it in half, one is a smaller box containing a number and a bigger box containing the name.

so before it's something like: td [name here] td

into something like td td[number] td td [name here] td td

the two should be under 1 column in the header which is a name. any thoughts?

here is the thead:

        <thead>
          <tr class="table1row">
            <th ROWSPAN="4"> SEQ # </th>
            <th ROWSPAN="4" class="table1name"> NAME  </th>
            <th ROWSPAN="2" COLSPAN="4" class="table1loa" > LOA </th>
            <th COLSPAN="4"> TARDINESS/UNDERTIME </th>
          <tr>
          <tr>
            <th ROWSPAN="1" COLSPAN="3"> No. of Working Days </th>
            <th ROWSPAN="2" COLSPAN="1" class="table1ex"> Period Covered </th>
            <th ROWSPAN="1" COLSPAN="2"> FREQUENCY </th>
            <th ROWSPAN="1" COLSPAN="2"> TOTAL </th>
          </tr>
          <tr>
            <th> <small>VL</small> </th>
            <th> <small>SL</small> </th>
            <th> <small>OtherS/*</small> </th>
            <th> Tardiness </th>
            <th> Undertime </th>
            <th> Hrs </th>
            <th> Min </th>
          </tr>
        </thead>

Upvotes: 0

Views: 498

Answers (2)

Krishna Raj Salim
Krishna Raj Salim

Reputation: 7390

is it what you need..?

<table border="1">
   <tr>
     <th colspan="2">Title</th>
   </tr>
   <tr>
     <td width250px>No.</td>
     <td width=100px>Name</td>
   </tr>
</table>

...

Upvotes: 1

Sri
Sri

Reputation: 2273

You can add a table inside td. so, the tbody would comes like the following. you can style the table inside td to avoid cellspacing and cellpadding to 0.

    <tbody>
      <tr class="table1row">
        <td ROWSPAN="4"> SEQ # </td>
        <td ROWSPAN="4" class="table1name">
          <table>
            <tr>
              <td>name</td>
              <td>number</td>
            </tr>
          </table>
        </td>      
        <td ROWSPAN="2" COLSPAN="4" class="table1loa" > LOA </td>
        <td COLSPAN="4"> TARDINESS/UNDERTIME </td>
      </tr>

      <tr>
        ....
      </tr>

      <tr>
        .....
      </tr>
    </tbody>

Note: You forgot to close the first tr in the <thead>.

Upvotes: 2

Related Questions