Surya Wono
Surya Wono

Reputation: 79

How to make merged html table head

Table head example

How to make html table head like that (in the link), and the content follow by 1 2 3 4 5 6 7

    <thead>
        <tr>
            <th rowspan="2">No.</th>
            <th rowspan="2">
                <tr>
                    <th colspan="2">
                        AKTA
                    </th>
                </tr>
                <tr>
                    <th>
                        NO
                    </th>
                    <th>
                        TGL
                    </th>
                </tr>
            </th>
            <th rowspan="2">
                KODE
            </th>
        </tr>
    </thead>

Upvotes: 0

Views: 114

Answers (1)

yana
yana

Reputation: 26

Try something like this instead: http://jsfiddle.net/J7R4y/1/

<table>
      <thead>
         <tr>
            <th rowspan="2">No.</th>
            <th colspan="2">AKTA</th>
            <th rowspan="2">KODE</th>
            <th colspan="2">NAMA ALAMAT DAN NPWP</th>
            <th rowspan="2">JENIS &amp; NOMOR HAK</th>
        </tr>
        <tr>
            <th>NO</th>
            <th>TGL</th>
            <th>PENJUAL</th>
            <th>PEMBELI</th>
        </tr>
    </thead>
</table>

I left the styling up to you. In the future, don't nest tr elements one inside the other.

Upvotes: 1

Related Questions