droidev
droidev

Reputation: 7390

How to arrange table td using rowspan

I have to arrange table cells as shown in the image below, I am using bootstrap, and I have adjusted it using colspan. but it not works as like in the image.

enter image description here

I have fiddeled here

<table class="table table-bordered table-responsive">
<thead></thead>
<tfoot></tfoot>
<tbody>
    <tr>
        <td rowspan="4">a</td>
        <td rowspan="2" colspan="2">aaa</td>
    </tr>
    <tr>
        <td>asas</td>
        <td>asas</td>
    </tr>
    <tr>
        <td>asas</td>
        <td>asas</td>

    </tr>
    <tr>
        <td>asas</td>
        <td>asas</td>

    </tr>
</tbody>

How can I get the table as shown in the image.

Upvotes: 0

Views: 340

Answers (1)

Chris Lam
Chris Lam

Reputation: 3614

I use this to generate the table:

<table border="1" width="500">
  <tr>
    <td rowspan="3">1</td>
    <td colspan="2">2</td>
  </tr>
  <tr>
    <td>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>5</td>
    <td>6</td>
  </tr>
  <tr>
    <td rowspan="4">7</td>
    <td>8</td>
    <td>9</td>
  </tr>
  <tr>
    <td>10</td>
    <td>11</td>
  </tr>
  <tr>
    <td>12</td>
    <td>13</td>
  </tr>
  <tr>
    <td>14</td>
    <td>15</td>
  </tr>
</table>

Upvotes: 1

Related Questions