<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Test: Border-spacing - contiguous table-row-groups (thead and tbody)</title>
<link rel="author" title="GĂ©rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#separated-borders" title="17.6.1 The separated borders model" />
<link rel="match" href="separated-border-model-007-ref.xht" />
<meta content="When a table element has 2 contiguous table-row-groups (thead, tbody, tfoot or more than 1 tbody elements), then border-spacing between such table-row-groups - thead and tbody in this testcase - must merge, must collapse into one." name="assert" />
<style type="text/css"><![CDATA[
body
{
font: 1em/2 serif;
margin: 1em;
}
div#expected-results {top: 1em;}
div
{
background-color: white;
height: 3em;
left: 1em;
position: absolute;
width: 600px;
}
table
{
background-color: red;
border-collapse: separate;
border-spacing: 0em 3em;
margin-top: 0px;
table-layout: fixed;
}
td
{
background-color: white;
height: 2em;
padding: 0px;
width: 600px;
}
div#between-thead-and-tbody {top: 6em;}
div#after-tbody {top: 11em;}
]]></style>
</head>
<body>
<table>
<thead>
<tr>
<td></td>
</tr>
</thead>
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
<div id="expected-results">Test passes if there is <strong>no red</strong>.</div>
<div id="between-thead-and-tbody"></div>
<div id="after-tbody"></div>
<!--
The vertical positioning of the (overlapped) table, sub-table
components and border-spacing areas between table-row-groups
0px
<body>'s margin-top
=================================== 16px (1em)
| |
| border=spacing 48px (3em) |
| with red background=color |
=================================== 64px (4em)
| <thead> |
| should be 32px (2em) |
=================================== 96px (6em)
| |
| border=spacing 48px (3em) |
| with red background=color |
=================================== 144px (9em)
| <tbody> |
| should be 32px (2em) |
=================================== 176px (11em)
| |
| border=spacing 48px (3em) |
| with red background=color |
=================================== 224px (14em)
********************************************
The vertical positioning of the absolutely positioned overlapping white <div>s
0px
<body>'s margin=top
=================================== 16px (1em)
| |
| div#expected=results 48px (3em) |
| with white background=color |
=================================== 64px (4em)
| |
| |
=================================== 96px (6em)
| |
| div#between=thead=and=tbody 48px|
| with white background=color |
=================================== 144px (9em)
| |
| |
=================================== 176px (11em)
| |
| div#after=tbody 48px (3em) |
| with white background=color |
=================================== 224px (14em)
-->
</body>
</html>