How to use colgroup element - Table Usability - Web Experience Toolkit (WET)

Anything regards to the HTML accessibility are not discussed here.

When the "colgroup" tag are used, they need to have the same width of each row in the table.

With one or no row group header

no thead or only one row in the thead

To understand the example after this section, here the column grouping are set a the level 1 simply because the column heading are reporting to the first row. When you will saw the column "Table Summary" this one make reference to the Level 0. That are similar to the tfoot element in the row group. When the "Table Summary" at level 0 are found in the column group, no more column group are allowed after.

Having two implecit colgroup. The first are a colgroup header. The second are a data colgroup.

Header Data Data Data Data Data
Header Data Data Data Data Data
Header Data Data Data Data Data
Header Data Data Data Data Data
Header Header Header Header Header Header
Header Data Data Data Data Data
Header Data Data Data Data Data
Header Data Data Data Data Data
Header Data Data Data Data Data
Source Code



<table>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
</table>


<table>
	<thead>
		<tr>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		</tr>
	</tbody>
</table>



Having two explicit colgroup. The first are a colgroup header. The second are a data colgroup.

 <colgroup /> <colgroup span="5" />
No table row Heading group (no thead)
Header Data Data Data Data Data
Header Data Data Data Data Data
Header Data Data Data Data Data
Header Data Data Data Data Data
 <colgroup /> <colgroup span="5" />
Header Header Header Header Header Header
Header Data Data Data Data Data
Header Data Data Data Data Data
Header Data Data Data Data Data
Header Data Data Data Data Data
Source Code




<table>
	<caption>No table row Heading group (no thead)</caption>

    <colgroup />
    <colgroup span="5" />

    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
    </tr>
</table>


<table>

    <colgroup />
    <colgroup span="5" />

	<thead>
		<tr>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
		</tr>
	</thead>

    <tbody>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		</tr>
    </tbody>
</table>


Having three explicit colgroup. The first are a colgroup header. The second are a data colgroup. The third are a summary group

 <colgroup /> <colgroup span="4" /> <colgroup />
Header Data Data Data Data Summary
Header Data Data Data Data Summary
Header Data Data Data Data Summary
Header Data Data Data Data Summary
 <colgroup /> <colgroup span="4" /> <colgroup />
Header Header Header Header Header Header
Header Data Data Data Data Summary
Header Data Data Data Data Summary
Header Data Data Data Data Summary
Header Data Data Data Data Summary
Source Code




<table>

    <colgroup />
    <colgroup span="4" />
    <colgroup />

    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Summary</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Summary</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Summary</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Data</td>
        <td>Summary</td>
    </tr>
</table>



<table>

    <colgroup />
    <colgroup span="4" />
    <colgroup />
	<thead>
		<tr>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
		</tr>
	</thead>

	<tbody>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Summary</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Summary</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Summary</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Summary</td>
		</tr>
    </tbody>
</table>


Having forth explicit colgroup. The first are a colgroup header. The second are a data colgroup. The third are a summary group. The forth will be know as the table colgroup summary, similar to a tfoot row group. For that table, no more colgroup will be allowed.

 <colgroup /> <colgroup span="2" /> <colgroup span="2" /> <colgroup />
Header Data Data Summary Summary Table Summary
Header Data Data Summary Summary Table Summary
Header Data Data Summary Summary Table Summary
Header Data Data Summary Summary Table Summary
 <colgroup /> <colgroup span="2" /> <colgroup span="2" /> <colgroup />
Header Header Header Header Header Header
Header Data Data Summary Summary Table Summary
Header Data Data Summary Summary Table Summary
Header Data Data Summary Summary Table Summary
Header Data Data Summary Summary Table Summary
Source Code




<table>

    <colgroup />
    <colgroup span="2" />
     <colgroup span="2" />
    <colgroup />

    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Summary</td>
        <td>Summary</td>
        <td>Table Summary</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Summary</td>
        <td>Summary</td>
        <td>Table Summary</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Summary</td>
        <td>Summary</td>
        <td>Table Summary</td>
    </tr>
    <tr>
    	<th>Header</th>
        <td>Data</td>
        <td>Data</td>
        <td>Summary</td>
        <td>Summary</td>
        <td>Table Summary</td>
    </tr>
</table>



<table>
    <colgroup />
    <colgroup span="2" />
     <colgroup span="2" />
    <colgroup />

	<thead>
		<tr>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
			<th>Header</th>
		</tr>
	</thead>

	<tbody>

		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Summary</td>
		    <td>Summary</td>
		    <td>Table Summary</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Summary</td>
		    <td>Summary</td>
		    <td>Table Summary</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Summary</td>
		    <td>Summary</td>
		    <td>Table Summary</td>
		</tr>
		<tr>
			<th>Header</th>
		    <td>Data</td>
		    <td>Data</td>
		    <td>Summary</td>
		    <td>Summary</td>
		    <td>Table Summary</td>
		</tr>
	</tbody>
</table>


Having fift or more explicit colgroup is possible but without any colgroup header and without any row group header (thead). All the colgroup will be now considerated to be a data group. With that system, a sodoku table are well structured with his three colgroup.

 <colgroup /> <colgroup span="2" /> <colgroup /> <colgroup /> <colgroup />
Data (group 1) Data (group 2) Data (group 2) Data (group 3) Data (group 4) Data (group 5)
Data (group 1) Data (group 2) Data (group 2) Data (group 3) Data (group 4) Data (group 5)
Data (group 1) Data (group 2) Data (group 2) Data (group 3) Data (group 4) Data (group 5)
Data (group 1) Data (group 2) Data (group 2) Data (group 3) Data (group 4) Data (group 5)
Source Code




<table>

    <colgroup />
    <colgroup span="2" />
    <colgroup />
    <colgroup />
    <colgroup />

    <tr>
    	<td>Data (group 1)</td>
        <td>Data (group 2)</td>
        <td>Data (group 2)</td>
        <td>Data (group 3)</td>
        <td>Data (group 4)</td>
        <td>Data (group 5)</td>
    </tr>
    <tr>
    	<td>Data (group 1)</td>
        <td>Data (group 2)</td>
        <td>Data (group 2)</td>
        <td>Data (group 3)</td>
        <td>Data (group 4)</td>
        <td>Data (group 5)</td>
    </tr>
    <tr>
    	<td>Data (group 1)</td>
        <td>Data (group 2)</td>
        <td>Data (group 2)</td>
        <td>Data (group 3)</td>
        <td>Data (group 4)</td>
        <td>Data (group 5)</td>
    </tr>
    <tr>
    	<td>Data (group 1)</td>
        <td>Data (group 2)</td>
        <td>Data (group 2)</td>
        <td>Data (group 3)</td>
        <td>Data (group 4)</td>
        <td>Data (group 5)</td>
    </tr>
</table>



Colgroup with two heading row

Now, the use of colgroup element start to be interresting at this point. There are almost no limit here, but a basic structure need to be followed. The rule is almost simple, with a summary column group at the second or subsequent row (called level) need to have above a column that his colgroup value include all the previous data colgroup in his level and the summary column group. The summary column group need to be represented by a header that are fully filling (in colspan) the column summary group.

So, here some example

 <colgroup span="5" /> <colgroup />
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2
Data - L2 Data - L2 Data - L2 Data - L2 Data - L2 Summary - L2
Data - L2 Data - L2 Data - L2 Data - L2 Data - L2 Summary - L2
Data - L2 Data - L2 Data - L2 Data - L2 Data - L2 Summary - L2
Data - L2 Data - L2 Data - L2 Data - L2 Data - L2 Summary - L2
Source Code



<table>

    <colgroup span="5" />
    <colgroup />

    <thead>
    	<tr>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
        </tr>
    </tbody>
</table>

 <colgroup span="5" /> <colgroup />
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2
Data - L2 Data - L2 Data - L2 Data - L2 Data - L2 Summary - L1
Data - L2 Data - L2 Data - L2 Data - L2 Data - L2 Summary - L1
Data - L2 Data - L2 Data - L2 Data - L2 Data - L2 Summary - L1
Data - L2 Data - L2 Data - L2 Data - L2 Data - L2 Summary - L1
Source Code



<table>

    <colgroup span="5" />
    <colgroup />

    <thead>
    	<tr>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="3">Heading - L1</th>
        	<th rowspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
        </tr>
    </tbody>
</table>

 <colgroup span="4" /> <colgroup span="2" />
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2
Data - L2 Data - L2 Data - L2 Data - L2 Summary - L1 Summary - L1
Data - L2 Data - L2 Data - L2 Data - L2 Summary - L1 Summary - L1
Data - L2 Data - L2 Data - L2 Data - L2 Summary - L1 Summary - L1
Data - L2 Data - L2 Data - L2 Data - L2 Summary - L1 Summary - L1
Source Code


<table>

    <colgroup span="4" />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
    </tbody>
</table>

 <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup />
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2
Data - L2 Summary - L2 Data - L2 Summary - L2 Data - L2 Summary - L2
Data - L2 Summary - L2 Data - L2 Summary - L2 Data - L2 Summary - L2
Data - L2 Summary - L2 Data - L2 Summary - L2 Data - L2 Summary - L2
Data - L2 Summary - L2 Data - L2 Summary - L2 Data - L2 Summary - L2
Source Code


<table>

    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />

    <thead>
    	<tr>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
        </tr>
    </tbody>
</table>

 <colgroup span="2" /> <colgroup span="2" /> <colgroup span="2" />
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2
Data - L2 Data - L2 Summary - L1 Summary - L1 Table Summary - L0 Table Summary - L0
Data - L2 Data - L2 Summary - L1 Summary - L1 Table Summary - L0 Table Summary - L0
Data - L2 Data - L2 Summary - L1 Summary - L1 Table Summary - L0 Table Summary - L0
Data - L2 Data - L2 Summary - L1 Summary - L1 Table Summary - L0 Table Summary - L0
Source Code


<table>

    <colgroup span="2" />
    <colgroup span="2" />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
    </tbody>
</table>

Funny

  <colgroup span="2" /> <colgroup span="4" />
INVALID
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2 Heading - L2
Data - L2 Data - L2 Summary - L1 Summary - L1 Summary - L1 Summary - L1
Data - L2 Data - L2 Summary - L1 Summary - L1 Summary - L1 Summary - L1
Data - L2 Data - L2 Summary - L1 Summary - L1 Summary - L1 Summary - L1
Data - L2 Data - L2 Summary - L1 Summary - L1 Summary - L1 Summary - L1
Source Code


<table>
	<caption>INVALID</caption>

    <colgroup span="2" />
    <colgroup span="4" />

    <thead>
    	<tr>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
            <th>Heading - L2</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
    </tbody>
</table>


Colgroup with three heading row

Now let check with a third row in the row group heading

  <colgroup span="2" /> <colgroup span="4" />
Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L3 Data - L3 Summary - L1 Summary - L1 Summary - L1 Summary - L1
Data - L3 Data - L3 Summary - L1 Summary - L1 Summary - L1 Summary - L1
Data - L3 Data - L3 Summary - L1 Summary - L1 Summary - L1 Summary - L1
Data - L3 Data - L3 Summary - L1 Summary - L1 Summary - L1 Summary - L1
Source Code


<table>

    <colgroup span="2" />
    <colgroup span="4" />

    <thead>
    	<tr>
        	<th colspan="2" rowspan="2">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
        	<th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
    </tbody>
</table>

This one are not good, because the data level are growing and second colgroup can not be refered to a summary row group

 <colgroup span="2" /> <colgroup span="2" /> <colgroup span="2" />
Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L3 Data - L3 ERROR - L2 ERROR - L2 Undefined - L2 Undefined - L2
Data - L3 Data - L3 ERROR - L2 ERROR - L2 Undefined - L2 Undefined - L2
Data - L3 Data - L3 ERROR - L2 ERROR - L2 Undefined - L2 Undefined - L2
Data - L3 Data - L3 ERROR - L2 ERROR - L2 Undefined - L2 Undefined - L2
Source Code



<table>

    <colgroup span="2" />
    <colgroup span="2" />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th colspan="2" rowspan="2">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
        	<th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>ERROR - L2</td>
            <td>ERROR - L2</td>
            <td>Undefined - L2</td>
            <td>Undefined - L2</td>
        </tr>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>ERROR - L2</td>
            <td>ERROR - L2</td>
            <td>Undefined - L2</td>
            <td>Undefined - L2</td>
        </tr>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>ERROR - L2</td>
            <td>ERROR - L2</td>
            <td>Undefined - L2</td>
            <td>Undefined - L2</td>
        </tr>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>ERROR - L2</td>
            <td>ERROR - L2</td>
            <td>Undefined - L2</td>
            <td>Undefined - L2</td>
        </tr>
    </tbody>
</table>

But this one are correct

 <colgroup span="4" /> <colgroup span="2" />
Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L3 Data - L3 Data - L3 Data - L3 Summary - L2 Summary - L2
Data - L3 Data - L3 Data - L3 Data - L3 Summary - L2 Summary - L2
Data - L3 Data - L3 Data - L3 Data - L3 Summary - L2 Summary - L2
Data - L3 Data - L3 Data - L3 Data - L3 Summary - L2 Summary - L2
Source Code


<table>

    <colgroup span="4" />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th colspan="2" rowspan="2">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
        	<th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
    </tbody>
</table>

If we play with the row span attribute of the heading in the two first column, we would change the data level.

 <colgroup span="4" /> <colgroup span="2" />
Heading - L1 Heading - L1
Heading - L2 Heading - L2 Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L2 Data - L2 Data - L3 Data - L3 Summary - L2 Summary - L2
Data - L2 Data - L2 Data - L3 Data - L3 Summary - L2 Summary - L2
Data - L2 Data - L2 Data - L3 Data - L3 Summary - L2 Summary - L2
Data - L2 Data - L2 Data - L3 Data - L3 Summary - L2 Summary - L2
Source Code


<table>

    <colgroup span="4" />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th colspan="2">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
        </tr>

    	<tr>
        	<th rowspan="2">Heading - L2</th>
            <th rowspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
    </tbody>
</table>

And again, let's remove the header that are spanned for the two first column

 <colgroup span="4" /> <colgroup span="2" />
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L1 Data - L1 Data - L3 Data - L3 Summary - L2 Summary - L2
Data - L1 Data - L1 Data - L3 Data - L3 Summary - L2 Summary - L2
Data - L1 Data - L1 Data - L3 Data - L3 Summary - L2 Summary - L2
Data - L1 Data - L1 Data - L3 Data - L3 Summary - L2 Summary - L2
Source Code


<table>

    <colgroup span="4" />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th rowspan="3">Heading - L1</th>
            <th rowspan="3">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L1</td>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
    </tbody>
</table>

Now we will set the second column to be an summary column group

 <colgroup /> <colgroup /> <colgroup span="2" /> <colgroup span="2" />
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L1 Summary - L1 Data - L2 Data - L2 Summary - L2 Summary - L2
Data - L1 Summary - L1 Data - L2 Data - L2 Summary - L2 Summary - L2
Data - L1 Summary - L1 Data - L2 Data - L2 Summary - L2 Summary - L2
Data - L1 Summary - L1 Data - L2 Data - L2 Summary - L2 Summary - L2
Source Code


<table>


    <colgroup />
    <colgroup />
    <colgroup span="2" />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th rowspan="3">Heading - L1</th>
            <th rowspan="3">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L2</td>
            <td>Data - L2</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
    </tbody>
</table>

A combinaison of a data group with a summary group always know as a data group in a higher level perspective.

 <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup />
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3
Source Code


<table>

    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />

    <thead>
    	<tr>
        	<th rowspan="3">Heading - L1</th>
            <th rowspan="3">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
        </tr>
    </tbody>
</table>

If we would like for example to add a summary for the heading Level 2, we would need to add a new column like this.

 <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup span="2" />
Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Summary - L2 Summary - L2
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Summary - L2 Summary - L2
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Summary - L2 Summary - L2
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Summary - L2 Summary - L2
Source Code


<table>

    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th rowspan="3">Heading - L1</th>
            <th rowspan="3">Heading - L1</th>
        	<th colspan="6">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Summary - L2</td>
            <td>Summary - L2</td>
        </tr>
    </tbody>
</table>

Now transforming the last Heading Level 2 into a heading Level 1. We get the Table summary colgroup because a summary group already exist for the heading at the level 1.

 <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup span="2" />
Heading - L1 Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Table Summary - L0 Table Summary - L0
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Table Summary - L0 Table Summary - L0
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Table Summary - L0 Table Summary - L0
Data - L1 Summary - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Table Summary - L0 Table Summary - L0
Source Code


<table>

    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th rowspan="3">Heading - L1</th>
            <th rowspan="3">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
        	<th rowspan="2" colspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
    </tbody>
</table>

After a quick view of the previous table, a recommendation will be to move and recalculate the data of the colgroup set to be the summary of Level 1. The next table don't have correct colgroup set.

 <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup span="2" />
Heading - L1 Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L1 ERROR - L3 Undefined Undefined Undefined Undefined Undefined Undefined
Data - L1 ERROR - L3 Undefined Undefined Undefined Undefined Undefined Undefined
Data - L1 ERROR - L3 Undefined Undefined Undefined Undefined Undefined Undefined
Data - L1 ERROR - L3 Undefined Undefined Undefined Undefined Undefined Undefined
Source Code


<table>

    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th rowspan="3">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
            <th rowspan="3">Heading - L1</th>
        	<th rowspan="2" colspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L1</td>
            <td>ERROR - L3</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>ERROR - L3</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>ERROR - L3</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>ERROR - L3</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
            <td>Undefined</td>
        </tr>
    </tbody>
</table>

To fix the error, we need to change the first colgroup with a span on two column:

 <colgroup span="2" /> <colgroup /> <colgroup /> <colgroup /> <colgroup /> <colgroup span="2" />
Heading - L1 Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Summary - L1 Table Summary - L0 Table Summary - L0
Data - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Summary - L1 Table Summary - L0 Table Summary - L0
Data - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Summary - L1 Table Summary - L0 Table Summary - L0
Data - L1 Data - L3 Summary - L3 Data - L3 Summary - L3 Summary - L1 Table Summary - L0 Table Summary - L0
Source Code


<table>

    <colgroup span="2" />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th rowspan="3">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
            <th rowspan="3">Heading - L1</th>
        	<th rowspan="2" colspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Summary - L1</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Summary - L1</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Summary - L1</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Data - L3</td>
            <td>Summary - L3</td>
            <td>Summary - L1</td>
            <td>Table Summary - L0</td>
            <td>Table Summary - L0</td>
        </tr>
    </tbody>
</table>

Here a example with only two colgroup

 <colgroup span="6" /> <colgroup span="2" />
Heading - L1 Heading - L1 Heading - L1 Heading - L1
Heading - L2 Heading - L2
Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3 Heading - L3
Data - L1 Data - L3 Data - L3 Data - L3 Data - L3 Data - L1 Summary - L1 Summary - L1
Data - L1 Data - L3 Data - L3 Data - L3 Data - L3 Data - L1 Summary - L1 Summary - L1
Data - L1 Data - L3 Data - L3 Data - L3 Data - L3 Data - L1 Summary - L1 Summary - L1
Data - L1 Data - L3 Data - L3 Data - L3 Data - L3 Data - L1 Summary - L1 Summary - L1
Source Code


<table>

    <colgroup span="6" />
    <colgroup span="2" />

    <thead>
    	<tr>
        	<th rowspan="3">Heading - L1</th>
        	<th colspan="4">Heading - L1</th>
            <th rowspan="3">Heading - L1</th>
        	<th rowspan="2" colspan="2">Heading - L1</th>
        </tr>

    	<tr>
        	<th colspan="2">Heading - L2</th>
        	<th colspan="2">Heading - L2</th>
        </tr>

    	<tr>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
            <th>Heading - L3</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
        <tr>
            <td>Data - L1</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L3</td>
            <td>Data - L1</td>
            <td>Summary - L1</td>
            <td>Summary - L1</td>
        </tr>
    </tbody>
</table>

Conclusion

With that method, it's not possible to use the attribute scope="colgroup" because that can not be applied to every colgroup. If you have planned to use the scope attribute, why you would like to reproduce something that can be programaticly determined just by the heading structure ? If you want o make those table accessible WCAG Level AA compliant, we would need to use the technique H43: Using id and headers attributes to associate data cells with header cells in data tables. In regards of the special project I am work on, it would be possible, after the table will be parsed, to auto-assign id/headers attribute.

I almost forget to specify something about the heading structure in the row group header. I don't know if you have see that but in that structure, a header declared in the second, third, ... row, the column need to be smaller than the header positioned at top of it. That is in regards of his colspan attribute.