<!doctype html> <title>CSS Test: Table section ordering</title> <link rel="author" href="mailto:atotic@chromium.org"> <link rel="help" href="https://www.w3.org/TR/CSS22/tables.html#table-display"> <link rel="match" href="row-group-order-ref.html"> <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> <style> table { font: 8px Ahem; border-collapse: collapse; } thead, tbody, tfoot { border: 10px solid; } .first { border-color: green; } .second { border-color: blue; } .third { border-color: yellow; } tbody { border-color: orange; } td { width: 50px; height: 50px; } </style> <table> <tbody> <tr><td>body 1</td></tr> </tbody> <thead class="first"> <tr><td>head 1</td></tr> </thead> <thead class="second"> <tr><td>head 2</td></tr> </thead> <tbody> <tr><td>body 2</td></tr> </tbody> <thead class="third"> <tr><td>head 3</td></tr> </thead> <tfoot class="first"> <tr><td>foot 1</td></tr> </tfoot> <tbody> <tr><td>body 3</td></tr> </tbody> <tfoot class="second"> <tr><td>foot 2</td></tr> </tfoot> <tbody> <tr><td>body 4</td></tr> </tbody> <tfoot class="third"> <tr><td>foot 3</td></tr> </tfoot> </table>