drafts: changeset 7175:d245107579c4

Copied from the member-only version, because it is easier to generate a complete property index for the WG when the draft is linked from http://www.w3.org/Style/CSS/current-work

     1.1 Binary file css3-tables/CSStbl3.png has changed

     2.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     2.2 +++ b/css3-tables/Makefile	Fri Jan 11 16:51:55 2013 +0100
     2.3 @@ -0,0 +1,1 @@
     2.4 +include ../css3-layout/Makefile

     3.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     3.2 +++ b/css3-tables/Overview.html	Fri Jan 11 16:51:55 2013 +0100
     3.3 @@ -0,0 +1,3934 @@
     3.4 +<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
     3.5 +
     3.6 +<html lang=en>
     3.7 + <head profile="http://dublincore.org/documents/2008/08/04/dc-html/ ">
     3.8 +  <title>CSS3 Tables Module</title>
     3.9 +
    3.10 +  <link href="http://purl.org/dc/terms/" rel=schema.dcterms>
    3.11 +  <link href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright"
    3.12 +   rel=dcterms.rights>
    3.13 +  <meta content="CSS3 Tables Module" name=dcterms.title>
    3.14 +  <meta content=text name=dcterms.type>
    3.15 +  <meta content=2012-11-13 name=dcterms.issued>
    3.16 +  <meta content="Bert Bos" name=dcterms.creator>
    3.17 +  <meta content="[editor name" name=dcterms.creator>
    3.18 +  <meta content=W3C name=dcterms.publisher>
    3.19 +  <meta content="http://www.w3.org/TR/2012/ED-css3-tables-20121113/"
    3.20 +   name=dcterms.identifier>
    3.21 +  <link href="../default.css" rel=stylesheet type="text/css">
    3.22 +  <style type="text/css">
    3.23 +  /* Just in case an incorrect max-width occurs in default.css */
    3.24 +  body {max-width: none !important}
    3.25 +  </style>
    3.26 +  <link href="http://www.w3.org/StyleSheets/TR/W3C-ED" rel=stylesheet
    3.27 +   type="text/css">
    3.28 +
    3.29 + <body>
    3.30 +  <div class=head> <!--begin-logo-->
    3.31 +   <p><a href="http://www.w3.org/"><img alt=W3C height=48
    3.32 +    src="http://www.w3.org/Icons/w3c_home" width=72></a> <!--end-logo-->
    3.33 +
    3.34 +   <h1>CSS3 Tables Module</h1>
    3.35 +
    3.36 +   <h2 class="no-num no-toc" id=longstatus-date-21-feb-2002>Editor's Draft 13
    3.37 +    November 2012</h2>
    3.38 +
    3.39 +   <dl>
    3.40 +    <dt>This version:
    3.41 +
    3.42 +    <dd><a
    3.43 +     href="http://www.w3.org/TR/2012/ED-css3-tables-20121113/">http://www.w3.org/2012/MO-css3-tables-20121113</a>
    3.44 +
    3.45 +    <dt>Latest version:
    3.46 +
    3.47 +    <dd><a
    3.48 +     href="http://www.w3.org/TR/css3-tables/">http://www.w3.org/TR/css3-tables/</a>
    3.49 +
    3.50 +    <dt>Previous version:
    3.51 +
    3.52 +    <dd><a
    3.53 +     href="[http://www.w3.org/PreviousVersionURI]">[http://www.w3.org/PreviousVersionURI]</a>
    3.54 +
    3.55 +    <dt>Editors:
    3.56 +
    3.57 +    <dd><a href="http://www.w3.org/People/Bos">Bert Bos</a>, <a
    3.58 +     href="http://www.w3.org/">W3C</a>, <a
    3.59 +     href="mailto:bert@w3.org">&lt;bert@w3.org&gt;</a>
    3.60 +
    3.61 +    <dd>[editor name, affiliation (opt.), email address (opt.)]
    3.62 +   </dl>
    3.63 +   <!--begin-copyright-->
    3.64 +   <p class=copyright><a
    3.65 +    href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright"
    3.66 +    rel=license>Copyright</a> © 2012 <a href="http://www.w3.org/"><abbr
    3.67 +    title="World Wide Web Consortium">W3C</abbr></a><sup>®</sup> (<a
    3.68 +    href="http://www.csail.mit.edu/"><abbr
    3.69 +    title="Massachusetts Institute of Technology">MIT</abbr></a>, <a
    3.70 +    href="http://www.ercim.eu/"><abbr
    3.71 +    title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></a>,
    3.72 +    <a href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C <a
    3.73 +    href="http://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>,
    3.74 +    <a
    3.75 +    href="http://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a>
    3.76 +    and <a
    3.77 +    href="http://www.w3.org/Consortium/Legal/copyright-documents">document
    3.78 +    use</a> rules apply.</p>
    3.79 +   <!--end-copyright-->
    3.80 +   <hr title="Separator for header">
    3.81 +  </div>
    3.82 +
    3.83 +  <h2 class="no-num no-toc" id=abstract>Abstract</h2>
    3.84 +
    3.85 +  <p>CSS (Cascading Style Sheets) is a language for specifying the rendering
    3.86 +   of a structured document (in HTML or XML). See the CSS3 introduction <a
    3.87 +   href="#CSS3INTRO" rel=biblioentry>[CSS3INTRO]<!--{{CSS3INTRO}}--></a> for
    3.88 +   more on CSS. The <em>CSS3 table module</em> is one of the modules of level
    3.89 +   3 of CSS and defines the properties that specify how tables are to be
    3.90 +   displayed visually or spoken by a speech synthesizer.
    3.91 +
    3.92 +  <p>This is a very rough draft. It consists of the text of the CSS2 chapter
    3.93 +   on tables, with almost no changes yet., except for the addition of the
    3.94 +   first section, "Tabs &amp; leaders."
    3.95 +
    3.96 +  <h2 class="no-num no-toc" id=status>Status of this document</h2>
    3.97 +
    3.98 +  <p
    3.99 +   style="background: #fdd; color: red; font-weight: bold; text-align: center; padding: .5em; border: thick solid red; border-radius: 1em">This
   3.100 +   specification is not being actively maintained, and should not be used as
   3.101 +   a guide for implementations. It may be revived in the future, but for now
   3.102 +   should be considered obsolete. <br>
   3.103 +   If you have questions or comments on this specification, please send an
   3.104 +   email to the CSS Working Group's mailing list at <a
   3.105 +   href="mailto:www-style@w3.org">www-style@w3.org</a>. (Before sending mail
   3.106 +   for the first time, you have to subscribe at <a
   3.107 +   href="http://lists.w3.org/Archives/Public/www-style/">http://lists.w3.org/Archives/Public/www-style/</a>.)</p>
   3.108 +  <!--begin-status-->
   3.109 +
   3.110 +  <p>This is a public copy of the editors' draft. It is provided for
   3.111 +   discussion only and may change at any moment. Its publication here does
   3.112 +   not imply endorsement of its contents by W3C. Don't cite this document
   3.113 +   other than as work in progress.
   3.114 +
   3.115 +  <p>The (<a
   3.116 +   href="http://lists.w3.org/Archives/Public/www-style/">archived</a>) public
   3.117 +   mailing list <a
   3.118 +   href="mailto:www-style@w3.org?Subject=%5Bcss3-tables%5D%20PUT%20SUBJECT%20HERE">
   3.119 +   www-style@w3.org</a> (see <a
   3.120 +   href="http://www.w3.org/Mail/Request">instructions</a>) is preferred for
   3.121 +   discussion of this specification. When sending e-mail, please put the text
   3.122 +   “css3-tables” in the subject, preferably like this:
   3.123 +   “[<!---->css3-tables<!---->] <em>…summary of comment…</em>”
   3.124 +
   3.125 +  <p>This document was produced by the <a href="/Style/CSS/members">CSS
   3.126 +   Working Group</a> (part of the <a href="/Style/">Style Activity</a>).
   3.127 +
   3.128 +  <p>This document was produced by a group operating under the <a
   3.129 +   href="/Consortium/Patent-Policy-20040205/">5 February 2004 W3C Patent
   3.130 +   Policy</a>. W3C maintains a <a href="/2004/01/pp-impl/32061/status"
   3.131 +   rel=disclosure>public list of any patent disclosures</a> made in
   3.132 +   connection with the deliverables of the group; that page also includes
   3.133 +   instructions for disclosing a patent. An individual who has actual
   3.134 +   knowledge of a patent which the individual believes contains <a
   3.135 +   href="/Consortium/Patent-Policy-20040205/#def-essential">Essential
   3.136 +   Claim(s)</a> must disclose the information in accordance with <a
   3.137 +   href="/Consortium/Patent-Policy-20040205/#sec-Disclosure">section 6 of the
   3.138 +   W3C Patent Policy</a>.</p>
   3.139 +  <!--end-status-->
   3.140 +
   3.141 +  <p>The text hasn't yet been synchronized with the latest version of
   3.142 +   CSS 2.1.
   3.143 +
   3.144 +  <h2 class="no-num no-toc" id=table-of-contents><a name=contents>Table of
   3.145 +   contents</a></h2>
   3.146 +  <!--begin-toc-->
   3.147 +
   3.148 +  <ul class=toc>
   3.149 +   <li><a href="#dependencies-on-other-modules"><span class=secno>1.
   3.150 +    </span>Dependencies on other modules</a>
   3.151 +
   3.152 +   <li><a href="#the-tab-properties-tabs-and-leaders"><span class=secno>2.
   3.153 +    </span>The ‘<code class=property>tab</code>’ properties: tabs and
   3.154 +    leaders</a>
   3.155 +
   3.156 +   <li><a href="#introduction-to-tables"><span class=secno>3.
   3.157 +    </span>Introduction to tables</a>
   3.158 +
   3.159 +   <li><a href="#the-css-table-model"><span class=secno>4. </span>The CSS
   3.160 +    table model</a>
   3.161 +    <ul class=toc>
   3.162 +     <li><a href="#anonymous-boxes"><span class=secno>4.1. </span>Anonymous
   3.163 +      table objects</a>
   3.164 +    </ul>
   3.165 +
   3.166 +   <li><a href="#columns"><span class=secno>5. </span>Columns</a>
   3.167 +
   3.168 +   <li><a href="#model"><span class=secno>6. </span>Tables in the visual
   3.169 +    formatting model</a>
   3.170 +    <ul class=toc>
   3.171 +     <li><a href="#caption-position-and-alignment"><span class=secno>6.1.
   3.172 +      </span>Caption position and alignment</a>
   3.173 +    </ul>
   3.174 +
   3.175 +   <li><a href="#Visual"><span class=secno>7. </span>Visual layout of table
   3.176 +    contents</a>
   3.177 +    <ul class=toc>
   3.178 +     <li><a href="#table-layers"><span class=secno>7.1. </span>Table layers
   3.179 +      and transparency</a>
   3.180 +
   3.181 +     <li><a href="#width-layout"><span class=secno>7.2. </span>Table width
   3.182 +      algorithms: the ‘<code class=property>table-layout</code>’
   3.183 +      property</a>
   3.184 +      <ul class=toc>
   3.185 +       <li><a href="#fixed-table-layout"><span class=secno>7.2.1.
   3.186 +        </span>Fixed table layout</a>
   3.187 +
   3.188 +       <li><a href="#auto-table-layout"><span class=secno>7.2.2.
   3.189 +        </span>Automatic table layout</a>
   3.190 +      </ul>
   3.191 +
   3.192 +     <li><a href="#height-layout"><span class=secno>7.3. </span>Table height
   3.193 +      algorithms</a>
   3.194 +
   3.195 +     <li><a href="#column-alignment"><span class=secno>7.4. </span>Horizontal
   3.196 +      alignment in a column</a>
   3.197 +
   3.198 +     <li><a href="#dynamic-effects"><span class=secno>7.5. </span>Dynamic row
   3.199 +      and column effects</a>
   3.200 +    </ul>
   3.201 +
   3.202 +   <li><a href="#borders"><span class=secno>8. </span>Borders</a>
   3.203 +    <ul class=toc>
   3.204 +     <li><a href="#separated-borders"><span class=secno>8.1. </span>The
   3.205 +      separated borders model</a>
   3.206 +      <ul class=toc>
   3.207 +       <li><a href="#empty-cells"><span class=secno>8.1.1. </span>Borders
   3.208 +        around empty cells: the ‘<code class=property>empty-cells</code>’
   3.209 +        property</a>
   3.210 +      </ul>
   3.211 +
   3.212 +     <li><a href="#collapsing-borders"><span class=secno>8.2. </span>The
   3.213 +      collapsing border model</a>
   3.214 +      <ul class=toc>
   3.215 +       <li><a href="#border-conflict-resolution"><span class=secno>8.2.1.
   3.216 +        </span>Border conflict resolution</a>
   3.217 +
   3.218 +       <li><a href="#collapsed-bg"><span class=secno>8.2.2.
   3.219 +        </span>Backgrounds in the collapsed border model</a>
   3.220 +      </ul>
   3.221 +
   3.222 +     <li><a href="#border-styles"><span class=secno>8.3. </span>Border
   3.223 +      styles</a>
   3.224 +    </ul>
   3.225 +
   3.226 +   <li><a href="#the-table-column-span-and-table-row-span"><span
   3.227 +    class=secno>9. </span>The ‘<code
   3.228 +    class=property>table-column-span</code>’ and ‘<code
   3.229 +    class=property>table-row-span</code>’ properties</a>
   3.230 +
   3.231 +   <li><a href="#aligning-tables-table-baseline-property"><span
   3.232 +    class=secno>10. </span>Aligning tables: ‘<code
   3.233 +    class=property>table-baseline</code>’ property</a>
   3.234 +
   3.235 +   <li><a href="#audio-rendering-of-tables"><span class=secno>11.
   3.236 +    </span>Audio rendering of tables</a>
   3.237 +    <ul class=toc>
   3.238 +     <li><a href="#speak-headers"><span class=secno>11.1. </span>Speaking
   3.239 +      headers: the ‘<code class=property>speak-header</code>’
   3.240 +      property</a>
   3.241 +    </ul>
   3.242 +
   3.243 +   <li class=no-num><a href="#acknowledgments">Acknowledgments</a>
   3.244 +
   3.245 +   <li class=no-num><a href="#references">References</a>
   3.246 +    <ul class=toc>
   3.247 +     <li class=no-num><a href="#normative-references">Normative
   3.248 +      references</a>
   3.249 +
   3.250 +     <li class=no-num><a href="#other-references">Other references</a>
   3.251 +    </ul>
   3.252 +
   3.253 +   <li class=no-num><a href="#index">Index</a>
   3.254 +
   3.255 +   <li class=no-num><a href="#property-index">Property index</a>
   3.256 +  </ul>
   3.257 +  <!--end-toc-->
   3.258 +
   3.259 +  <hr>
   3.260 +
   3.261 +  <h2 id=dependencies-on-other-modules><span class=secno>1.
   3.262 +   </span>Dependencies on other modules</h2>
   3.263 +
   3.264 +  <p>This CSS3 module depends on the following other CSS3 modules:
   3.265 +
   3.266 +  <ul>
   3.267 +   <li>CSS3 Box Model <a href="#CSS3BOX"
   3.268 +    rel=biblioentry>[CSS3BOX]<!--{{!CSS3BOX}}--></a>
   3.269 +
   3.270 +   <li>CSS3 Syntax Module <a href="#CSS3SYN"
   3.271 +    rel=biblioentry>[CSS3SYN]<!--{{!CSS3SYN}}--></a>
   3.272 +
   3.273 +   <li>CSS3 Values and Units Module <a href="#CSS3VAL"
   3.274 +    rel=biblioentry>[CSS3VAL]<!--{{!CSS3VAL}}--></a>
   3.275 +
   3.276 +   <li>[module]
   3.277 +  </ul>
   3.278 +
   3.279 +  <h2 id=the-tab-properties-tabs-and-leaders><span class=secno>2. </span>The
   3.280 +   ‘<a href="#tab"><code class=property>tab</code></a>’ properties: tabs
   3.281 +   and leaders</h2>
   3.282 +
   3.283 +  <p class=issue>[Does it belong here, or in the line box model?]
   3.284 +
   3.285 +  <p class=issue>[This material is new. (Well, actually, <a
   3.286 +   href=css-tabs.html>it dates from 1996</a>, but it is new in this draft.)
   3.287 +   Not reviewed yet in any way.]
   3.288 +
   3.289 +  <p class=issue>[The name "tab" maybe reminds people too much of the tab
   3.290 +   character, which plays no role here at all. Maybe a different name is
   3.291 +   better. "Anchor"?]
   3.292 +
   3.293 +  <p class=issue>[Could this be merged with the margin-left/margin-right
   3.294 +   properties to save some properties? ‘<code class=css>margin-left: 25%
   3.295 +   fixed</code>’ instead of ‘<code class=css>tab: 25% left</code>’?]
   3.296 +
   3.297 +  <p class=issue>Håkon will write a proposal for a ‘<code
   3.298 +   class=css>leader(&lt;string&gt;)</code>’ notation that can be put in the
   3.299 +   ‘<code class=property>content</code>’ property, inside ‘<code
   3.300 +   class=css>::after</code>’ and ‘<code class=css>::before</code>’,
   3.301 +   independent of any tab properties. It will push everything after it (up to
   3.302 +   the end of the block or the explicit next line break, whichever comes
   3.303 +   first) forward, so that it ends at the end of a line. Often, that may make
   3.304 +   tabs unnecessary. [12 Jan 2005] That proposal is now in <a
   3.305 +   href="#CSS3GCPM" rel=biblioentry>[CSS3GCPM]<!--{{CSS3GCPM}}--></a>.
   3.306 +
   3.307 +  <table class=propdef>
   3.308 +   <tbody>
   3.309 +    <tr>
   3.310 +     <td><em>Name:</em>
   3.311 +
   3.312 +     <td><dfn id=tab-position>tab-position</dfn>
   3.313 +
   3.314 +    <tr>
   3.315 +     <td><em>Value:</em>
   3.316 +
   3.317 +     <td><var>&lt;length&gt;</var> | <var>&lt;percentage&gt;</var>
   3.318 +
   3.319 +    <tr>
   3.320 +     <td><em>Initial:</em>
   3.321 +
   3.322 +     <td>0
   3.323 +
   3.324 +    <tr>
   3.325 +     <td><em>Applies to:</em>
   3.326 +
   3.327 +     <td>inline-level elements
   3.328 +
   3.329 +    <tr>
   3.330 +     <td><em>Inherited:</em>
   3.331 +
   3.332 +     <td>no
   3.333 +
   3.334 +    <tr>
   3.335 +     <td><em>Percentages:</em>
   3.336 +
   3.337 +     <td>width* of containing block
   3.338 +
   3.339 +    <tr>
   3.340 +     <td><em>Media:</em>
   3.341 +
   3.342 +     <td>visual
   3.343 +
   3.344 +    <tr>
   3.345 +     <td><em>Computed value:</em>
   3.346 +
   3.347 +     <td>&lt;length&gt;
   3.348 +
   3.349 +    <tr>
   3.350 +     <td colspan=2>*) if the containing block is ‘<code
   3.351 +      class=property>horizontal</code>’, otherwise height
   3.352 +  </table>
   3.353 +
   3.354 +  <table class=propdef>
   3.355 +   <tbody>
   3.356 +    <tr>
   3.357 +     <td><em>Name:</em>
   3.358 +
   3.359 +     <td><dfn id=tab-align>tab-align</dfn>
   3.360 +
   3.361 +    <tr>
   3.362 +     <td><em>Value:</em>
   3.363 +
   3.364 +     <td>left | top | center | right | bottom | <var>&lt;string&gt;</var> |
   3.365 +      none
   3.366 +
   3.367 +    <tr>
   3.368 +     <td><em>Initial:</em>
   3.369 +
   3.370 +     <td>none
   3.371 +
   3.372 +    <tr>
   3.373 +     <td><em>Applies to:</em>
   3.374 +
   3.375 +     <td>inline-level elements
   3.376 +
   3.377 +    <tr>
   3.378 +     <td><em>Inherited:</em>
   3.379 +
   3.380 +     <td>no
   3.381 +
   3.382 +    <tr>
   3.383 +     <td><em>Percentages:</em>
   3.384 +
   3.385 +     <td>N/A
   3.386 +
   3.387 +    <tr>
   3.388 +     <td><em>Media:</em>
   3.389 +
   3.390 +     <td>visual
   3.391 +
   3.392 +    <tr>
   3.393 +     <td><em>Computed value:</em>
   3.394 +
   3.395 +     <td>specified value
   3.396 +  </table>
   3.397 +
   3.398 +  <table class=propdef>
   3.399 +   <tbody>
   3.400 +    <tr>
   3.401 +     <td><em>Name:</em>
   3.402 +
   3.403 +     <td><dfn id=tab-leaders>tab-leaders</dfn>
   3.404 +
   3.405 +    <tr>
   3.406 +     <td><em>Value:</em>
   3.407 +
   3.408 +     <td><var>&lt;string&gt;</var>
   3.409 +
   3.410 +    <tr>
   3.411 +     <td><em>Initial:</em>
   3.412 +
   3.413 +     <td>"" (empty string)
   3.414 +
   3.415 +    <tr>
   3.416 +     <td><em>Applies to:</em>
   3.417 +
   3.418 +     <td>inline-level elements
   3.419 +
   3.420 +    <tr>
   3.421 +     <td><em>Inherited:</em>
   3.422 +
   3.423 +     <td>no
   3.424 +
   3.425 +    <tr>
   3.426 +     <td><em>Percentages:</em>
   3.427 +
   3.428 +     <td>N/A
   3.429 +
   3.430 +    <tr>
   3.431 +     <td><em>Media:</em>
   3.432 +
   3.433 +     <td>visual
   3.434 +
   3.435 +    <tr>
   3.436 +     <td><em>Computed value:</em>
   3.437 +
   3.438 +     <td>specified value
   3.439 +  </table>
   3.440 +
   3.441 +  <table class=propdef>
   3.442 +   <tbody>
   3.443 +    <tr>
   3.444 +     <td><em>Name:</em>
   3.445 +
   3.446 +     <td><dfn id=tab-leaders-alignment>tab-leaders-alignment</dfn>
   3.447 +
   3.448 +    <tr>
   3.449 +     <td><em>Value:</em>
   3.450 +
   3.451 +     <td>aligned | centered | distributed
   3.452 +
   3.453 +    <tr>
   3.454 +     <td><em>Initial:</em>
   3.455 +
   3.456 +     <td>aligned
   3.457 +
   3.458 +    <tr>
   3.459 +     <td><em>Applies to:</em>
   3.460 +
   3.461 +     <td>inline-level elements
   3.462 +
   3.463 +    <tr>
   3.464 +     <td><em>Inherited:</em>
   3.465 +
   3.466 +     <td>no
   3.467 +
   3.468 +    <tr>
   3.469 +     <td><em>Percentages:</em>
   3.470 +
   3.471 +     <td>N/A
   3.472 +
   3.473 +    <tr>
   3.474 +     <td><em>Media:</em>
   3.475 +
   3.476 +     <td>visual
   3.477 +
   3.478 +    <tr>
   3.479 +     <td><em>Computed value:</em>
   3.480 +
   3.481 +     <td>specified value
   3.482 +  </table>
   3.483 +
   3.484 +  <table class=propdef>
   3.485 +   <tbody>
   3.486 +    <tr>
   3.487 +     <td><em>Name:</em>
   3.488 +
   3.489 +     <td><dfn id=tab>tab</dfn>
   3.490 +
   3.491 +    <tr>
   3.492 +     <td><em>Value:</em>
   3.493 +
   3.494 +     <td>[ &lt;‘<a href="#tab-position"><code
   3.495 +      class=property>tab-position</code></a>’&gt; || &lt;‘<a
   3.496 +      href="#tab-align"><code class=property>tab-align</code></a>’&gt; ] [
   3.497 +      / [ &lt;‘<a href="#tab-leaders"><code
   3.498 +      class=property>tab-leaders</code></a>’&gt; || &lt;‘<a
   3.499 +      href="#tab-leaders-alignment"><code
   3.500 +      class=property>tab-leaders-alignment</code></a>’&gt; ] ]?
   3.501 +
   3.502 +    <tr>
   3.503 +     <td><em>Initial:</em>
   3.504 +
   3.505 +     <td>see individual properties
   3.506 +
   3.507 +    <tr>
   3.508 +     <td><em>Applies to:</em>
   3.509 +
   3.510 +     <td>inline-level elements
   3.511 +
   3.512 +    <tr>
   3.513 +     <td><em>Inherited:</em>
   3.514 +
   3.515 +     <td>no
   3.516 +
   3.517 +    <tr>
   3.518 +     <td><em>Percentages:</em>
   3.519 +
   3.520 +     <td>see individual properties
   3.521 +
   3.522 +    <tr>
   3.523 +     <td><em>Media:</em>
   3.524 +
   3.525 +     <td>visual
   3.526 +
   3.527 +    <tr>
   3.528 +     <td><em>Computed value:</em>
   3.529 +
   3.530 +     <td>see individual properties
   3.531 +  </table>
   3.532 +
   3.533 +  <p>An inline element can be put at a specific position in the line by
   3.534 +   setting the element's <a class=property href="#tab">‘<code
   3.535 +   class=property>tab</code>’</a> property. The space that creates before
   3.536 +   the element can be filled with <dfn id=leaders>leaders</dfn> or left
   3.537 +   blank.
   3.538 +
   3.539 +  <div class=example>
   3.540 +   <p>Here are some examples:
   3.541 +
   3.542 +   <pre>signature { tab: 100% right }      /* right-aligned at end of line */
   3.543 +amount { tab: -1em "." }           /* aligned on dot, 1em from end of line */
   3.544 +desc { tab: 0 left }               /* left-aligned to start of line */
   3.545 +pageno { tab: 100% right / " . " } /* right-aligned, with dot leaders */
   3.546 +col2 { tab: 50% center / " · " }   /* centered in the line */</pre>
   3.547 +
   3.548 +   <p>With a document fragment like the following:
   3.549 +
   3.550 +   <pre>&lt;expenses&gt;
   3.551 +&lt;desc&gt;Hotel&lt;/desc&gt; &lt;amount&gt;374.55&lt;/amount&gt;
   3.552 +&lt;desc&gt;Travel&lt;/desc&gt; &lt;amount&gt;1460.10&lt;/amount&gt;
   3.553 +&lt;desc&gt;Miscellaneous, including presents and
   3.554 +tips&lt;/desc&gt; &lt;amount&gt;84.00&lt;/amount&gt;
   3.555 +&lt;desc&gt;Total&lt;/desc&gt; &lt;amount&gt;1918.65&lt;/amount&gt;
   3.556 +&lt;signature&gt;Ph. Fogg&lt;/signature&gt;
   3.557 +&lt;/expenses&gt;</pre>
   3.558 +
   3.559 +   <p>The rendering might be as follows:
   3.560 +
   3.561 +   <div class=figure>
   3.562 +    <p><img alt="[image]" src=tabs.png>
   3.563 +
   3.564 +    <p class=caption>Possible rendering of a text with tabs and leaders
   3.565 +   </div>
   3.566 +  </div>
   3.567 +
   3.568 +  <p>The <a class=property href="#tab-position">‘<code
   3.569 +   class=property>tab-position</code>’</a> and <a class=property
   3.570 +   href="#tab-align">‘<code class=property>tab-align</code>’</a>
   3.571 +   determine the position of the element in the line. The element is
   3.572 +   positioned by inserting extra whitespace or leaders before it. Setting a
   3.573 +   tab will never cause the element to overlap any other element on the line
   3.574 +   (unless it would already overlap without the tab, because of negative
   3.575 +   margins). It may be necessary for the UA to insert so much
   3.576 +   whitespace/leaders, that the alignment point of the tab occurs on one of
   3.577 +   the following lines. (The example above shows one such case.)
   3.578 +
   3.579 +  <p>The <a class=property href="#tab-position">‘<code
   3.580 +   class=property>tab-position</code>’</a> gives the position of a point on
   3.581 +   the line to which the element will be aligned. A negative
   3.582 +   <var>&lt;length&gt;</var> is measured from the end of the line, a
   3.583 +   nonnegative one from the beginning. Ditto for percentages, where
   3.584 +   percentages are relative to the width of the <span>containing block</span>
   3.585 +   (or height, if the containing block's <span>orientation</span> is
   3.586 +   vertical). It depends on the writing mode of the containing block which
   3.587 +   edge is the start of the line. <span class=issue>[Or is it more intuitive
   3.588 +   to always count positive lengths from the left or top and negative ones
   3.589 +   from the right or bottom?]</span>
   3.590 +
   3.591 +  <p>The position is measured from the <em>content edge</em> of the
   3.592 +   containing block and is independent of any floats that may make the line
   3.593 +   box narrower than the content box. As usual for inline elements in the
   3.594 +   presence of floats, the alignment point and the element to which it
   3.595 +   belongs will be moved to a following line, if it would otherwise overlap
   3.596 +   the float.
   3.597 +
   3.598 +  <p class=note>Note that a value of ‘<code class=css>0</code>’ means the
   3.599 +   start of the line. Use 100% to refer to the end of the line.
   3.600 +
   3.601 +  <p><a class=property href="#tab-align">‘<code
   3.602 +   class=property>Tab-align</code>’</a> specifies how the element is
   3.603 +   aligned to the alignment point:
   3.604 +
   3.605 +  <dl>
   3.606 +   <dt>‘<a href="#none"><code class=property>none</code></a>’
   3.607 +
   3.608 +   <dd>The element is not aligned to any alignment point and is put
   3.609 +    immediately after the previous element, with no intervening leaders.
   3.610 +
   3.611 +   <dt>‘<code class=property>left</code>’, ‘<a href="#top0"><code
   3.612 +    class=property>top</code></a>’
   3.613 +
   3.614 +   <dd>These are the same and mean that the left <em>margin edge</em> (or
   3.615 +    top, if vertical) of the element is at the given position in the line.
   3.616 +    <p>If the element consists of multiple boxes (because of bidi processing
   3.617 +     or line breaks), which of the boxes is aligned depends on the <a
   3.618 +     class=property href="#direction">‘<code
   3.619 +     class=property>direction</code>’</a> of the containing block: the
   3.620 +     first box in the case of <span class=css>‘<code
   3.621 +     class=property>ltr</code>’</span>, the last box in the case of <span
   3.622 +     class=css>‘<code class=property>rtl</code>’</span>.
   3.623 +
   3.624 +   <dt>‘<code class=property>right</code>’, ‘<a href="#bottom0"><code
   3.625 +    class=property>bottom</code></a>’
   3.626 +
   3.627 +   <dd>The right <em>margin edge</em> (or bottom, if vertical) is at the
   3.628 +    given position. If the <a class=property href="#direction">‘<code
   3.629 +    class=property>direction</code>’</a> of the containing block is <span
   3.630 +    class=css>‘<code class=property>ltr</code>’</span>, the element's
   3.631 +    last box is aligned, otherwise the first box.
   3.632 +
   3.633 +   <dt>‘<code class=property>center</code>’
   3.634 +
   3.635 +   <dd>The element is centered around the given position. If a line break
   3.636 +    occurs inside the element, the element might not be centered exactly.
   3.637 +
   3.638 +   <dt><var>&lt;string&gt;</var>
   3.639 +
   3.640 +   <dd>The beginning of the first occurrence of the string in the element is
   3.641 +    put at the alignment point. If the string does not occur in the element,
   3.642 +    the end of the content of the element is aligned.
   3.643 +  </dl>
   3.644 +
   3.645 +  <p class=issue>[Do we need ‘<code class=property>start</code>’ and
   3.646 +   ‘<code class=property>end</code>’ keywords that dynamically resolve to
   3.647 +   ‘<code class=property>left</code>’ or ‘<code
   3.648 +   class=property>right</code>’ depending on the writing direction?
   3.649 +   Probably not very useful. Ltr and rtl are not symmetrical: even in rtl
   3.650 +   text, numbers are right aligned.]
   3.651 +
   3.652 +  <p>The <a class=property href="#tab-leaders">‘<code
   3.653 +   class=property>tab-leaders</code>’</a> property determines what is
   3.654 +   inserted before the element to make it align. If the value is the empty
   3.655 +   string, only whitespace is inserted, otherwise multiple copies of the
   3.656 +   string are inserted, as many as needed. If there is not room for a whole
   3.657 +   number of copies, the remaining part is filled with whitespace. The style
   3.658 +   (color, font, etc.) of the leaders is that of the element's parent (i.e.,
   3.659 +   not necessarily the same as the element's own style).
   3.660 +
   3.661 +  <p>The values of <a class=property href="#tab-leaders-alignment">‘<code
   3.662 +   class=property>tab-leaders-alignment</code>’</a> have the following
   3.663 +   meaning:
   3.664 +
   3.665 +  <dl>
   3.666 +   <dt>‘<code class=property>centered</code>’
   3.667 +
   3.668 +   <dd>If the space for the leaders is not a whole number of copies of the <a
   3.669 +    class=property href="#tab-leaders">‘<code
   3.670 +    class=property>tab-leaders</code>’</a> string, half of the extra
   3.671 +    whitespace is inserted before the first string, and half after the last
   3.672 +    string. (If there is a line break the middle of the leaders, it may not
   3.673 +    be possible to have exactly half the space on both sides.)
   3.674 +
   3.675 +   <dt>‘<code class=property>distributed</code>’
   3.676 +
   3.677 +   <dd>Like for <span class=css>‘<code
   3.678 +    class=property>centered</code>’</span>, but the extra whitespace is
   3.679 +    inserted in equal amounts before the first, after the last and between
   3.680 +    the strings.
   3.681 +
   3.682 +   <dt>‘<code class=property>aligned</code>’
   3.683 +
   3.684 +   <dd>The <a class=property href="#tab-leaders">‘<code
   3.685 +    class=property>tab-leaders</code>’</a> strings are positioned such that
   3.686 +    there is room for exactly a whole number of copies between the string and
   3.687 +    the left content edge of the containing block. <span class=note>Note that
   3.688 +    this has the effect that all ‘<code class=property>aligned</code>’
   3.689 +    leaders on different lines are aligned with each other, as if they were
   3.690 +    attached to a common grid. The dot leaders in the previous example form
   3.691 +    such a grid.</span>
   3.692 +  </dl>
   3.693 +
   3.694 +  <p>The <a class=property href="#tab">‘<code
   3.695 +   class=property>tab</code>’</a> property is a shorthand to set all four
   3.696 +   properties together. Omitted values default to their initial values.
   3.697 +
   3.698 +  <p class=note>Note the slash (/) in the value of <a class=property
   3.699 +   href="#tab">‘<code class=property>tab</code>’</a>: if leaders are
   3.700 +   specified, they must be separated from the position &amp; alignment with a
   3.701 +   slash.
   3.702 +
   3.703 +  <p class=note>Note that <span class=css>‘<code class=css>tab: 2em /
   3.704 +   "."</code>’</span> is a valid, and occasionally useful declaration, but
   3.705 +   by itself does not cause any leaders to appear, because it implicitly sets
   3.706 +   <a class=property href="#tab-align">‘<code
   3.707 +   class=property>tab-align</code>’</a> to <a class=css
   3.708 +   href="#none">‘<code class=property>none</code>’</a>.
   3.709 +
   3.710 +  <p>Justification and line breaking algorithms may change the size of an
   3.711 +   element, but leave it aligned at the alignment point. (Although different
   3.712 +   algorithms and different settings of the relevant properties may cause the
   3.713 +   alignment point to fall on different lines.)
   3.714 +
   3.715 +  <p class=issue>[Do we need keywords such as ‘<code class=css>arrow-leader
   3.716 +   (for a stretchy arrow) or </code>’double-arrow-leader', or can they be
   3.717 +   made from existing characters? Or should ‘<a href="#tab-leaders"><code
   3.718 +   class=property>tab-leaders</code></a>’ accept up to 3 strings, e.g.,
   3.719 +   "\2190" "\2500" "\2192" ("←" "─" "→"), for start, middle and end of
   3.720 +   the leaders?]
   3.721 +
   3.722 +  <h2 id=introduction-to-tables><span class=secno>3. </span>Introduction to
   3.723 +   tables</h2>
   3.724 +
   3.725 +  <p class=issue>What happens with tables in vertical text (‘<code
   3.726 +   class=css>writing-mode: tb-rl</code>’ etc.)? Are tables rotated or not?
   3.727 +   Currently, the specification says rows are horizontal and the only
   3.728 +   influence is from ‘<a href="#direction"><code
   3.729 +   class=property>direction</code></a>’, which may cause the next column to
   3.730 +   be on the left of the current one instead of the right.
   3.731 +
   3.732 +  <p>Table mark-up in a source document typically represents a particular
   3.733 +   relationship between three or more dimensions of data, e.g., dates,
   3.734 +   products and the number of units sold. Table properties in CSS are meant
   3.735 +   to style the representation of such data as a table. But the properties
   3.736 +   can occasionally also be used to align elements in rows and columns for
   3.737 +   purely visual reasons, rather than semantics. Unlike, e.g., the <a
   3.738 +   href="#table"><code class=html>table</code></a> element in HTML, the <a
   3.739 +   class=property href="#table">‘<code class=property>table</code>’</a>
   3.740 +   keyword doesn't imply any particular semantic relation between elements in
   3.741 +   the document.
   3.742 +
   3.743 +  <div class=example>
   3.744 +   <p> Here is a simple three-row, three-column table described in HTML 4:
   3.745 +
   3.746 +   <pre class=html-example>
   3.747 +&lt;TABLE&gt;
   3.748 +&lt;CAPTION&gt;This is a simple 3x3 table&lt;/CAPTION&gt;
   3.749 +&lt;TR id="row1"&gt;
   3.750 +   &lt;TH&gt;Header 1  &lt;TD&gt;Cell 1  &lt;TD&gt;Cell 2
   3.751 +&lt;TR id="row2"&gt;
   3.752 +   &lt;TH&gt;Header 2  &lt;TD&gt;Cell 3  &lt;TD&gt;Cell 4
   3.753 +&lt;TR id="row3"&gt;
   3.754 +   &lt;TH&gt;Header 3  &lt;TD&gt;Cell 5  &lt;TD&gt;Cell 6
   3.755 +&lt;/TABLE&gt;
   3.756 +</pre>
   3.757 +
   3.758 +   <p>This code creates one table (the <a href="#table"><code
   3.759 +    class=html>TABLE</code></a> element), three rows (the <code
   3.760 +    class=html>TR</code> elements), three header cells (the <code
   3.761 +    class=html>TH</code> elements), and six data cells (the <code
   3.762 +    class=html>TD</code> elements). Note that the three columns of this
   3.763 +    example are specified implicitly: there are as many columns in the table
   3.764 +    as required by header and data cells.
   3.765 +
   3.766 +   <p>The following CSS rule centers the text horizontally in the header
   3.767 +    cells and presents the text in the header cells with a bold font weight:
   3.768 +
   3.769 +   <pre>
   3.770 +th { text-align: center; font-weight: bold }
   3.771 +</pre>
   3.772 +
   3.773 +   <p>The next rules align the text of the header cells on their baseline and
   3.774 +    vertically center the text in each data cell:
   3.775 +
   3.776 +   <pre>
   3.777 +th { vertical-align: baseline }
   3.778 +td { vertical-align: middle }
   3.779 +</pre>
   3.780 +
   3.781 +   <p>The next rules specify that the top row will be surrounded by a 3px
   3.782 +    solid blue border and each of the other rows will be surrounded by a 1px
   3.783 +    solid black border:
   3.784 +
   3.785 +   <pre>
   3.786 +table   { border-collapse: collapse }
   3.787 +tr#row1 { border: 3px solid blue }
   3.788 +tr#row2 { border: 1px solid black }
   3.789 +tr#row3 { border: 1px solid black }
   3.790 +</pre>
   3.791 +
   3.792 +   <p>Note, however, that the borders around the rows overlap where the rows
   3.793 +    meet. What color (black or blue) and thickness (1px or 3px) will the
   3.794 +    border between row1 and row2 be? We discuss this in the section on <a
   3.795 +    href="#border-conflict-resolution">border conflict resolution.</a>
   3.796 +
   3.797 +   <p>The following rule puts the table caption above the table:
   3.798 +
   3.799 +   <pre>
   3.800 +caption { caption-side: top }
   3.801 +</pre>
   3.802 +  </div>
   3.803 +
   3.804 +  <p>The preceding example shows how CSS works with HTML 4 elements; in HTML
   3.805 +   4, the semantics of the various table elements (TABLE, CAPTION, THEAD,
   3.806 +   TBODY, TFOOT, COL, COLGROUP, TH, and TD) are well-defined. In other
   3.807 +   document languages (such as XML applications), there may not be
   3.808 +   pre-defined table elements. Therefore, CSS 2.1 allows authors to <span
   3.809 +   class=index-inst id=map
   3.810 +   title="mapping elements to table parts">"map"</span> document language
   3.811 +   elements to table elements via the <a class=propinst-display
   3.812 +   href="#display">‘<code class=property>display</code>’</a> property.
   3.813 +   For example, the following rule makes the FOO element act like an HTML
   3.814 +   TABLE element and the BAR element act like a CAPTION element:
   3.815 +
   3.816 +  <pre class=example>
   3.817 +FOO { display : table }
   3.818 +BAR { display : table-caption }
   3.819 +</pre>
   3.820 +
   3.821 +  <p id=internal>We discuss the various table elements in the following
   3.822 +   section. In this specification, the term <a class=index-def
   3.823 +   href="#table-element0" id=table-element title="table element"><dfn
   3.824 +   id=table-element0>table element</dfn></a> refers to any element involved
   3.825 +   in the creation of a table. An <span class=index-def
   3.826 +   id="�internal�-table-element"
   3.827 +   title="internal table element|table element::internal">“internal”
   3.828 +   table element</span> is one that produces a row, row group, column, column
   3.829 +   group, or cell.
   3.830 +
   3.831 +  <h2 id=the-css-table-model><span class=secno>4. </span>The CSS table model</h2>
   3.832 +
   3.833 +  <p>The CSS table model is based on the HTML 4.0 table model, in which the
   3.834 +   structure of a table closely parallels the visual layout of the table. In
   3.835 +   this model, a table consists of an optional caption and any number of rows
   3.836 +   of cells. The table model is said to be “row primary,” since authors
   3.837 +   specify rows, not columns, explicitly in the document language. Columns
   3.838 +   are derived once all the rows have been specified: the first cell of each
   3.839 +   row belongs to the first column, the second to the second column, etc.).
   3.840 +   Rows and columns may be grouped structurally and this grouping reflected
   3.841 +   in presentation (e.g., a border may be drawn around a group of rows).
   3.842 +
   3.843 +  <p>Thus, the table model consists of tables, captions, rows, row groups,
   3.844 +   columns, column groups, and cells.
   3.845 +
   3.846 +  <p>The CSS model does not require that the <span>document language</span>
   3.847 +   include elements that correspond to each of these components. For document
   3.848 +   languages (such as XML applications) that do not have pre-defined table
   3.849 +   elements, authors must map document language elements to table elements;
   3.850 +   this is done with the ‘<a href="#display"><code
   3.851 +   class=property>display</code></a>’ property. The following ‘<a
   3.852 +   href="#display"><code class=property>display</code></a>’ values assign
   3.853 +   table formatting rules to an arbitrary element:
   3.854 +
   3.855 +  <dl>
   3.856 +   <dt><dfn id=table>table</dfn> (In HTML: TABLE)
   3.857 +
   3.858 +   <dd>Specifies that an element defines a <em>block-level</em> table: it is
   3.859 +    a rectangular block that participates in a <em>block formatting
   3.860 +    context</em>.
   3.861 +
   3.862 +   <dt><dfn id=inline-table>inline-table</dfn> (In HTML: TABLE)
   3.863 +
   3.864 +   <dd>Specifies that an element defines an <em>inline-level</em> table: it
   3.865 +    is a rectangular block that participates in an <em>inline formatting
   3.866 +    context</em>.
   3.867 +
   3.868 +   <dt><dfn id=table-row>table-row</dfn> (In HTML: TR)
   3.869 +
   3.870 +   <dd>Specifies that an element is a row of cells.
   3.871 +
   3.872 +   <dt><dfn id=table-row-group>table-row-group</dfn> (In HTML: TBODY)
   3.873 +
   3.874 +   <dd>Specifies that an element groups one or more rows.
   3.875 +
   3.876 +   <dt><dfn id=table-header-group0>table-header-group</dfn> (In HTML: THEAD)
   3.877 +
   3.878 +   <dd>Like ‘<a href="#table-row-group"><code
   3.879 +    class=property>table-row-group</code></a>’, but for visual formatting,
   3.880 +    the row group is always displayed before all other rows and row groups
   3.881 +    and after any top captions. Print user agents may repeat header rows on
   3.882 +    each page spanned by a table. If a table contains multiple elements with
   3.883 +    ‘<code class=css>display: table-header-group</code>’, only the first
   3.884 +    is rendered as a header; the others are treated as if they had ‘<code
   3.885 +    class=css>display: table-row-group</code>’.
   3.886 +
   3.887 +   <dt><dfn id=table-footer-group>table-footer-group</dfn> (In HTML: TFOOT)
   3.888 +
   3.889 +   <dd>Like ‘<a href="#table-row-group"><code
   3.890 +    class=property>table-row-group</code></a>’, but for visual formatting,
   3.891 +    the row group is always displayed after all other rows and row groups and
   3.892 +    before any bottom captions. Print user agents may repeat footer rows on
   3.893 +    each page spanned by a table. If a table contains multiple elements with
   3.894 +    ‘<code class=css>display: table-footer-group</code>’, only the first
   3.895 +    is rendered as a footer; the others are treated as if they had ‘<code
   3.896 +    class=css>display: table-row-group</code>’.
   3.897 +
   3.898 +   <dt><dfn id=table-column>table-column</dfn> (In HTML: COL)
   3.899 +
   3.900 +   <dd>Specifies that an element describes a column of cells.
   3.901 +
   3.902 +   <dt><dfn id=table-column-group>table-column-group</dfn> (In HTML:
   3.903 +    COLGROUP)
   3.904 +
   3.905 +   <dd>Specifies that an element groups one or more columns.
   3.906 +
   3.907 +   <dt><dfn id=table-cell>table-cell</dfn> (In HTML: TD, TH)
   3.908 +
   3.909 +   <dd>Specifies that an element represents a table cell.
   3.910 +
   3.911 +   <dt><dfn id=table-caption>table-caption</dfn> (In HTML: CAPTION)
   3.912 +
   3.913 +   <dd>Specifies a caption for the table. All elements with ‘<code
   3.914 +    class=css>display: table-caption</code>’ must be rendered, as described
   3.915 +    in <a href="#model">section [??].</a>
   3.916 +  </dl>
   3.917 +
   3.918 +  <p>Replaced elements with these ‘<a href="#display"><code
   3.919 +   class=property>display</code></a>’ values are treated as their given
   3.920 +   display types during layout. For example, an image that is set to ‘<code
   3.921 +   class=css>display: table-cell</code>’ will fill the available cell
   3.922 +   space, and its dimensions might contribute towards the table sizing
   3.923 +   algorithms, as with an ordinary cell.
   3.924 +
   3.925 +  <p>Elements with ‘<a href="#display"><code
   3.926 +   class=property>display</code></a>’ set to ‘<a
   3.927 +   href="#table-column"><code class=property>table-column</code></a>’ or
   3.928 +   ‘<a href="#table-column-group"><code
   3.929 +   class=property>table-column-group</code></a>’ are not rendered (exactly
   3.930 +   as if they had ‘<code class=css>display: none</code>’), but they are
   3.931 +   useful, because they may have attributes which induce a certain style for
   3.932 +   the columns they represent.
   3.933 +
   3.934 +  <div class=issue>
   3.935 +   <p>The above, rewritten for ‘<code
   3.936 +    class=property>display-model</code>’ and ‘<code
   3.937 +    class=property>display-role</code>’:
   3.938 +
   3.939 +   <p>The values of <span class=property>‘<code
   3.940 +    class=property>display-model</code>’</span> that apply to tables have
   3.941 +    the following meaning. (For the purposes of the definitions in this
   3.942 +    section, any child elements with a <span class=property>‘<code
   3.943 +    class=property>display-role</code>’</span> of <a class=css
   3.944 +    href="#none">‘<code class=property>none</code>’</a> are considered to
   3.945 +    have been removed from the document tree.)
   3.946 +
   3.947 +   <dl>
   3.948 +    <dt>table
   3.949 +
   3.950 +    <dd>
   3.951 +     <p>The child elements are laid out as a stack of row-groups. In detail:
   3.952 +
   3.953 +     <p>Any uninterrupted sequence of child elements, including anonymous
   3.954 +      ones, with a role other than <span class=css>‘<code
   3.955 +      class=css>table-{row,header,footer}-group</code>’</span> or <a
   3.956 +      class=css href="#table-caption">‘<code
   3.957 +      class=property>table-caption</code>’</a> is wrapped in an anonymous
   3.958 +      element with role and model both set to <a class=css
   3.959 +      href="#table-row-group">‘<code
   3.960 +      class=property>table-row-group</code>’</a>.
   3.961 +
   3.962 +     <p>The resulting set of children is laid out as a stack of rows from top
   3.963 +      to bottom, with at the top any <a class=css
   3.964 +      href="#table-header-group0">‘<code
   3.965 +      class=property>table-header-group</code>’</a> child, then the <a
   3.966 +      class=css href="#table-row-group">‘<code
   3.967 +      class=property>table-row-group</code>’</a> children, in the order of
   3.968 +      the document, and finally any <a class=css
   3.969 +      href="#table-footer-group">‘<code
   3.970 +      class=property>table-footer-group</code>’</a> child. (Note also the
   3.971 +      difference between these three types for paged media, described <a
   3.972 +      href="#table-header-group">below.</a>)
   3.973 +
   3.974 +    <dt>table-row-group
   3.975 +
   3.976 +    <dd>
   3.977 +     <p>The children are laid out as a stack of rows. In detail:
   3.978 +
   3.979 +     <p>Any uninterrupted sequence of child elements with a role other than
   3.980 +      <a class=css href="#table-row">‘<code
   3.981 +      class=property>table-row</code>’</a> is wrapped in an anonymous
   3.982 +      element with role set to <a class=css href="#table-row">‘<code
   3.983 +      class=property>table-row</code>’</a> and model set to <span
   3.984 +      class=css>‘<code class=property>block-inside</code>’</span>.
   3.985 +
   3.986 +     <p>The resulting children are laid out as a stack of rows from top to
   3.987 +      bottom in the order of the document.
   3.988 +
   3.989 +    <dt>table-row
   3.990 +
   3.991 +    <dd>
   3.992 +     <p>The children are laid out as a row of table cells. In detail:
   3.993 +
   3.994 +     <p>Any uninterrupted sequence of children with a role other than <a
   3.995 +      class=css href="#table-cell">‘<code
   3.996 +      class=property>table-cell</code>’</a> is wrapped in an anonymous
   3.997 +      element with role set to <a class=css href="#table-cell">‘<code
   3.998 +      class=property>table-cell</code>’</a> and model set to <span
   3.999 +      class=css>‘<code class=property>block</code>’</span>.
  3.1000 +
  3.1001 +     <p>The resulting children are laid out from left to right in the order
  3.1002 +      of the document.
  3.1003 +
  3.1004 +    <dt>table-column-group
  3.1005 +
  3.1006 +    <dd>
  3.1007 +     <p>Any children with a role other than <a class=css
  3.1008 +      href="#table-column">‘<code class=property>table-column</code>’</a>
  3.1009 +      are ignored. The other children aren't rendered either, but some of
  3.1010 +      their properties influence the style of the table. See the section <a
  3.1011 +      href="#columns">Columns</a> below.
  3.1012 +
  3.1013 +    <dt>table-column
  3.1014 +
  3.1015 +    <dd>
  3.1016 +     <p>All children are ignored (as if their <span class=property>‘<code
  3.1017 +      class=property>display-role</code>’</span> was <a class=css
  3.1018 +      href="#none">‘<code class=property>none</code>’</a>) See the
  3.1019 +      section <a href="#columns">Columns</a> below for the function of
  3.1020 +      properties on this element.
  3.1021 +   </dl>
  3.1022 +
  3.1023 +   <p>See <a href="#width-layout">Table width algorithms</a> and <a
  3.1024 +    href="#height-layout">Table height algorithms</a> for the size of the
  3.1025 +    various elements.
  3.1026 +
  3.1027 +   <p>Where it says “top to bottom” or “left to right” in the
  3.1028 +    definitions above, this should be replaced by the appropriate direction
  3.1029 +    based on the value of <span class=property>‘<code
  3.1030 +    class=property>writing-mode</code>’</span> of the enclosing <a
  3.1031 +    class=css href="#table">‘<code class=property>table</code>’</a>
  3.1032 +    element, as follows. (Note that the writing mode of other elements in the
  3.1033 +    table may influence the direction of the context of the table cells, but
  3.1034 +    only the writing mode of the table element itself determines the
  3.1035 +    direction of the rows and columns.)
  3.1036 +
  3.1037 +   <dl>
  3.1038 +    <dt>lr-tb
  3.1039 +
  3.1040 +    <dd>Rows are stacked top to bottom and columns are laid out from left to
  3.1041 +     right (i.e., as in the definitions above).
  3.1042 +
  3.1043 +    <dt>rl-tb
  3.1044 +
  3.1045 +    <dd>Rows are stacked top to bottom and columns are laid out right to
  3.1046 +     left.
  3.1047 +
  3.1048 +    <dt>tb-rl
  3.1049 +
  3.1050 +    <dd>Rows are laid out from right to left and columns from top to bottom.
  3.1051 +
  3.1052 +    <dt>tb-lr
  3.1053 +
  3.1054 +    <dd>Rows are laid out from left to right and columns from top to bottom.
  3.1055 +   </dl>
  3.1056 +
  3.1057 +   <p class=note>Note that there are theoretically 8 ways that rows and
  3.1058 +    columns can be ordered, but only the above 4 are supported.
  3.1059 +
  3.1060 +   <p>The values of <span class=property>‘<code
  3.1061 +    class=property>table-role</code>’</span> have the following meaning
  3.1062 +
  3.1063 +   <dl>
  3.1064 +    <dt>table-cell
  3.1065 +
  3.1066 +    <dd>
  3.1067 +     <p>The element is a cell in a table row. If the parent, anonymous or
  3.1068 +      not, doesn't have the model <a class=css href="#table-row">‘<code
  3.1069 +      class=property>table-row</code>’</a>, an anonymous element is wrapped
  3.1070 +      around this element and all its sister elements with the same role that
  3.1071 +      form an uninterupted sequence. The anonymous element has a role and a
  3.1072 +      model of <a class=css href="#table-row">‘<code
  3.1073 +      class=property>table-row</code>’</a>.
  3.1074 +
  3.1075 +    <dt>table-caption
  3.1076 +
  3.1077 +    <dd>
  3.1078 +     <p>The element is the caption of a table. If the parent, anonymous or
  3.1079 +      not, has a model other than <a class=css href="#table">‘<code
  3.1080 +      class=property>table</code>’</a>, an anonymous element is wrapped
  3.1081 +      around this element and any sisters with a role of ‘<code
  3.1082 +      class=css>table-{row,header,footer}-group</code>’, ‘<a
  3.1083 +      href="#table-row"><code class=property>table-row</code></a>’, ‘<a
  3.1084 +      href="#table-column-group"><code
  3.1085 +      class=property>table-column-group</code></a>’ or ‘<a
  3.1086 +      href="#table-column"><code class=property>table-column</code></a>’
  3.1087 +      that form an uninterrupted sequence. The anonymous element has a role
  3.1088 +      of <span class=css>‘<code class=property>block</code>’</span> and a
  3.1089 +      model of <a class=css href="#table">‘<code
  3.1090 +      class=property>table</code>’</a>.
  3.1091 +
  3.1092 +     <p>If the <a class=css href="#table">‘<code
  3.1093 +      class=property>table</code>’</a> element that is this element's
  3.1094 +      parent has another child with role <a class=css
  3.1095 +      href="#table-caption">‘<code
  3.1096 +      class=property>table-caption</code>’</a> earlier in the document,
  3.1097 +      this element is treated as if it had a role of <span class=css>‘<code
  3.1098 +      class=property>block</code>’</span> instead. <span class=issue>[In
  3.1099 +      CSS 2.1 we said this situation was undefined and authors should not
  3.1100 +      use it...]</span>
  3.1101 +
  3.1102 +    <dt>table-row-group
  3.1103 +
  3.1104 +    <dd>
  3.1105 +     <p>The element is a group of rows. If the parent, anonymous or not, has
  3.1106 +      a model other than <a class=css href="#table">‘<code
  3.1107 +      class=property>table</code>’</a>, an anonymous element is wrapped
  3.1108 +      around this element and all its sister elements with a role of <span
  3.1109 +      class=css>table-{row,header,footer}-group'</span> that form an
  3.1110 +      uninterupted sequence. The anonymous element has a role of <span
  3.1111 +      class=css>‘<code class=property>block</code>’</span> and a model of
  3.1112 +      <a class=css href="#table">‘<code class=property>table</code>’</a>.
  3.1113 +
  3.1114 +    <dt id=table-header-group>table-header-group
  3.1115 +
  3.1116 +    <dd>
  3.1117 +     <p>The element is a group of rows that is displayed at the top of the
  3.1118 +      table, after any top caption. In paged media, if a page break occurs in
  3.1119 +      the table, the header group is repeated at the top of the table after
  3.1120 +      every page break.
  3.1121 +
  3.1122 +     <p>If the parent, anonymous or not, has a model other than <a class=css
  3.1123 +      href="#table">‘<code class=property>table</code>’</a>, an anonymous
  3.1124 +      element is wrapped around this element and all its sister elements with
  3.1125 +      a role of <span class=css>table-{row,header,footer}-group'</span> that
  3.1126 +      form an uninterupted sequence. The anonymous element has a role of
  3.1127 +      <span class=css>‘<code class=property>block</code>’</span> and a
  3.1128 +      model of <a class=css href="#table">‘<code
  3.1129 +      class=property>table</code>’</a>.
  3.1130 +
  3.1131 +    <dt>table-footer-group
  3.1132 +
  3.1133 +    <dd>
  3.1134 +     <p>The element is a group of rows that is displayed at the bottom of the
  3.1135 +      table, before any bottom caption. In paged media, if a page break
  3.1136 +      occurs in the table, the footer group is repeated at the bottom of the
  3.1137 +      table before every page break.
  3.1138 +
  3.1139 +     <p>If the parent, anonymous or not, has a model other than <a class=css
  3.1140 +      href="#table">‘<code class=property>table</code>’</a>, an anonymous
  3.1141 +      element is wrapped around this element and all its sister elements with
  3.1142 +      a role of <span class=css>table-{row,header,footer}-group'</span> that
  3.1143 +      form an uninterupted sequence. The anonymous element has a role of
  3.1144 +      <span class=css>‘<code class=property>block</code>’</span> and a
  3.1145 +      model of <a class=css href="#table">‘<code
  3.1146 +      class=property>table</code>’</a>.
  3.1147 +
  3.1148 +    <dt>table-column
  3.1149 +
  3.1150 +    <dd>
  3.1151 +     <p>The element creates a column. It's contents are ignored.
  3.1152 +
  3.1153 +     <p>If the parent, anonymous or not, has neither the model <a class=css
  3.1154 +      href="#table">‘<code class=property>table</code>’</a> nor <a
  3.1155 +      class=css href="#table-column-group">‘<code
  3.1156 +      class=property>table-column-group</code>’</a>, an anonymous element
  3.1157 +      is wrapped around this element and any sisters with a role of
  3.1158 +
  3.1159 +    <dd>
  3.1160 +   </dl>
  3.1161 +  </div>
  3.1162 +
  3.1163 +  <p class=issue>An <a
  3.1164 +   href="http://lists.w3.org/Archives/Public/www-style/2002Mar/0023.html">
  3.1165 +   idea</a> by Dorothea Salo of Open eBook Forum: some way to scroll a table
  3.1166 +   and keep the headers and footers on screen, plus a a vertical analogue.
  3.1167 +   Such "header columns" would stay on the screen during horizontal
  3.1168 +   scrolling.
  3.1169 +
  3.1170 +  <div class=example>
  3.1171 +   <p>The <a href="http://www.w3.org/TR/CSS2/sample.html">default style sheet
  3.1172 +    for HTML 4.0</a> in the appendix illustrates the use of these values for
  3.1173 +    HTML 4.0:
  3.1174 +
  3.1175 +   <pre>
  3.1176 +table    { display: table }
  3.1177 +tr       { display: table-row }
  3.1178 +thead    { display: table-header-group }
  3.1179 +tbody    { display: table-row-group }
  3.1180 +tfoot    { display: table-footer-group }
  3.1181 +col      { display: table-column }
  3.1182 +colgroup { display: table-column-group }
  3.1183 +td, th   { display: table-cell }
  3.1184 +caption  { display: table-caption }
  3.1185 +</pre>
  3.1186 +  </div>
  3.1187 +
  3.1188 +  <p>User agents may ignore these ‘<a href="#display"><code
  3.1189 +   class=property>display</code></a>’ property values for HTML table
  3.1190 +   elements, since HTML tables may be rendered using other algorithms
  3.1191 +   intended for backwards compatible rendering. However, this is not meant to
  3.1192 +   discourage the use of ‘<code class=css>display: table</code>’ on
  3.1193 +   other, non-table elements in HTML.
  3.1194 +
  3.1195 +  <p class=issue>Remove the above paragraph?
  3.1196 +
  3.1197 +  <h3 id=anonymous-boxes><span class=secno>4.1. </span>Anonymous table
  3.1198 +   objects</h3>
  3.1199 +
  3.1200 +  <p>Document languages other than HTML may not contain all the elements in
  3.1201 +   the CSS 2.1 table model. In these cases, the “missing” elements must
  3.1202 +   be assumed in order for the table model to work. Any table element will
  3.1203 +   automatically generate necessary anonymous table objects around itself,
  3.1204 +   consisting of at least three nested objects corresponding to a ‘<a
  3.1205 +   href="#table"><code class=property>table</code></a>’/‘<a
  3.1206 +   href="#inline-table"><code class=property>inline-table</code></a>’
  3.1207 +   element, a ‘<a href="#table-row"><code
  3.1208 +   class=property>table-row</code></a>’ element, and a ‘<a
  3.1209 +   href="#table-cell"><code class=property>table-cell</code></a>’ element.
  3.1210 +   Missing elements generate <em>anonymous</em> objects (e.g., anonymous
  3.1211 +   boxes in visual table layout) according to the following rules:
  3.1212 +
  3.1213 +  <ol>
  3.1214 +   <li>If the parent P of a ‘<a href="#table-cell"><code
  3.1215 +    class=css>table-cell</code></a>’ box T is not a ‘<a
  3.1216 +    href="#table-row"><code class=css>table-row</code></a>’, a box
  3.1217 +    corresponding to a ‘<a href="#table-row"><code
  3.1218 +    class=css>table-row</code></a>’ will be generated between P and T. This
  3.1219 +    box will span all consecutive ‘<a href="#table-cell"><code
  3.1220 +    class=property>table-cell</code></a>’ sibling boxes of T.
  3.1221 +
  3.1222 +   <li>If the parent P of a ‘<a href="#table-row"><code
  3.1223 +    class=css>table-row</code></a>’ box T is not a ‘<a
  3.1224 +    href="#table"><code class=css>table</code></a>’, ‘<a
  3.1225 +    href="#inline-table"><code class=css>inline-table</code></a>’, ‘<a
  3.1226 +    href="#table-header-group0"><code
  3.1227 +    class=css>table-header-group</code></a>’, ‘<a
  3.1228 +    href="#table-footer-group"><code
  3.1229 +    class=css>table-footer-group</code></a>’ or ‘<a
  3.1230 +    href="#table-row-group"><code class=css>table-row-group</code></a>’
  3.1231 +    box, a box corresponding to a ‘<a href="#table"><code
  3.1232 +    class=css>table</code></a>’ element will be generated between P and T.
  3.1233 +    If P is an ‘<code class=css>inline</code>’ box, then the generated
  3.1234 +    box must be an ‘<a href="#inline-table"><code
  3.1235 +    class=css>inline-table</code></a>’ box instead of a ‘<a
  3.1236 +    href="#table"><code class=css>table</code></a>’ box. This box will span
  3.1237 +    all consecutive sibling boxes of T that require a ‘<a
  3.1238 +    href="#table"><code class=css>table</code></a>’ parent: ‘<a
  3.1239 +    href="#table-row"><code class=css>table-row</code></a>’, ‘<a
  3.1240 +    href="#table-row-group"><code class=css>table-row-group</code></a>’,
  3.1241 +    ‘<a href="#table-header-group0"><code
  3.1242 +    class=css>table-header-group</code></a>’, ‘<a
  3.1243 +    href="#table-footer-group"><code
  3.1244 +    class=css>table-footer-group</code></a>’, ‘<a
  3.1245 +    href="#table-column"><code class=css>table-column</code></a>’, ‘<a
  3.1246 +    href="#table-column-group"><code
  3.1247 +    class=css>table-column-group</code></a>’, and ‘<a
  3.1248 +    href="#table-caption"><code class=css>table-caption</code></a>’. T and
  3.1249 +    T's siblings may also be anonymous ‘<a href="#table-row"><code
  3.1250 +    class=css>table-row</code></a>’ boxes generated by rule 1.
  3.1251 +
  3.1252 +   <li>If the parent P of a ‘<a href="#table-column"><code
  3.1253 +    class=css>table-column</code></a>’ box T is not a ‘<a
  3.1254 +    href="#table"><code class=css>table</code></a>’, ‘<a
  3.1255 +    href="#inline-table"><code class=css>inline-table</code></a>’, or ‘<a
  3.1256 +    href="#table-column-group"><code
  3.1257 +    class=css>table-column-group</code></a>’ box, a box corresponding to a
  3.1258 +    ‘<a href="#table"><code class=css>table</code></a>’ element will be
  3.1259 +    generated between P and T. If P is an ‘<code class=css>inline</code>’
  3.1260 +    box, then the generated box must be an ‘<a href="#inline-table"><code
  3.1261 +    class=css>inline-table</code></a>’ box instead of a ‘<a
  3.1262 +    href="#table"><code class=css>table</code></a>’ box. This box will span
  3.1263 +    all consecutive sibling boxes of T that require a ‘<a
  3.1264 +    href="#table"><code class=css>table</code></a>’ parent: ‘<a
  3.1265 +    href="#table-row"><code class=css>table-row</code></a>’, ‘<a
  3.1266 +    href="#table-row-group"><code class=css>table-row-group</code></a>’,
  3.1267 +    ‘<a href="#table-header-group0"><code
  3.1268 +    class=css>table-header-group</code></a>’, ‘<a
  3.1269 +    href="#table-footer-group"><code
  3.1270 +    class=css>table-footer-group</code></a>’, ‘<a
  3.1271 +    href="#table-column"><code class=css>table-column</code></a>’, ‘<a
  3.1272 +    href="#table-column-group"><code
  3.1273 +    class=css>table-column-group</code></a>’, and ‘<a
  3.1274 +    href="#table-caption"><code class=css>table-caption</code></a>’,
  3.1275 +    including any anonymous ‘<a href="#table-row"><code
  3.1276 +    class=css>table-row</code></a>’ boxes generated by rule 1.
  3.1277 +
  3.1278 +   <li>If the parent P of a ‘<a href="#table-row-group"><code
  3.1279 +    class=css>table-row-group</code></a>’ (or ‘<a
  3.1280 +    href="#table-header-group0"><code
  3.1281 +    class=css>table-header-group</code></a>’, ‘<a
  3.1282 +    href="#table-footer-group"><code
  3.1283 +    class=css>table-footer-group</code></a>’, or ‘<a
  3.1284 +    href="#table-column-group"><code
  3.1285 +    class=css>table-column-group</code></a>’ or ‘<a
  3.1286 +    href="#table-caption"><code class=css>table-caption</code></a>’) box T
  3.1287 +    is not a ‘<a href="#table"><code class=css>table</code></a>’ or ‘<a
  3.1288 +    href="#inline-table"><code class=css>inline-table</code></a>’, a box
  3.1289 +    corresponding to a ‘<a href="#table"><code
  3.1290 +    class=css>table</code></a>’ element will be generated between P and T.
  3.1291 +    If P is an ‘<code class=css>inline</code>’ box, then the generated
  3.1292 +    box must be an ‘<a href="#inline-table"><code
  3.1293 +    class=css>inline-table</code></a>’ box instead of a ‘<a
  3.1294 +    href="#table"><code class=css>table</code></a>’ box. This box will span
  3.1295 +    all consecutive sibling boxess of T that require a ‘<a
  3.1296 +    href="#table"><code class=css>table</code></a>’ parent: ‘<a
  3.1297 +    href="#table-row"><code class=css>table-row</code></a>’, ‘<a
  3.1298 +    href="#table-row-group"><code class=css>table-row-group</code></a>’,
  3.1299 +    ‘<a href="#table-header-group0"><code
  3.1300 +    class=css>table-header-group</code></a>’, ‘<a
  3.1301 +    href="#table-footer-group"><code
  3.1302 +    class=css>table-footer-group</code></a>’, ‘<a
  3.1303 +    href="#table-column"><code class=css>table-column</code></a>’, ‘<a
  3.1304 +    href="#table-column-group"><code
  3.1305 +    class=css>table-column-group</code></a>’, and ‘<a
  3.1306 +    href="#table-caption"><code class=css>table-caption</code></a>’,
  3.1307 +    including any anonymous ‘<a href="#table-row"><code
  3.1308 +    class=css>table-row</code></a>’ boxes generated by rule 1.
  3.1309 +
  3.1310 +   <li>If a child T of a ‘<a href="#table"><code
  3.1311 +    class=css>table</code></a>’ box (or ‘<a href="#inline-table"><code
  3.1312 +    class=css>inline-table</code></a>’) P is not a ‘<a
  3.1313 +    href="#table-row-group"><code class=css>table-row-group</code></a>’,
  3.1314 +    ‘<a href="#table-header-group0"><code
  3.1315 +    class=css>table-header-group</code></a>’, ‘<a
  3.1316 +    href="#table-footer-group"><code
  3.1317 +    class=css>table-footer-group</code></a>’, ‘<a
  3.1318 +    href="#table-caption"><code class=css>table-caption</code></a>’, ‘<a
  3.1319 +    href="#table-column"><code class=css>table-column</code></a>’, ‘<a
  3.1320 +    href="#table-column-group"><code
  3.1321 +    class=css>table-column-group</code></a>’ or ‘<a
  3.1322 +    href="#table-row"><code class=css>table-row</code></a>’ box, a box
  3.1323 +    corresponding to a ‘<a href="#table-row"><code
  3.1324 +    class=css>table-row</code></a>’ element will be generated between P and
  3.1325 +    T. This box spans all consecutive siblings of T that are not ‘<a
  3.1326 +    href="#table-row-group"><code class=css>table-row-group</code></a>’,
  3.1327 +    ‘<a href="#table-header-group0"><code
  3.1328 +    class=css>table-header-group</code></a>’, ‘<a
  3.1329 +    href="#table-footer-group"><code
  3.1330 +    class=css>table-footer-group</code></a>’, ‘<a
  3.1331 +    href="#table-caption"><code class=css>table-caption</code></a>’, ‘<a
  3.1332 +    href="#table-column"><code class=css>table-column</code></a>’, ‘<a
  3.1333 +    href="#table-column-group"><code
  3.1334 +    class=css>table-column-group</code></a>’ or ‘<a
  3.1335 +    href="#table-row"><code class=css>table-row</code></a>’ boxes.
  3.1336 +
  3.1337 +   <li>If a child T of a ‘<a href="#table-row-group"><code
  3.1338 +    class=css>table-row-group</code></a>’ box (or ‘<a
  3.1339 +    href="#table-header-group0"><code
  3.1340 +    class=css>table-header-group</code></a>’ or ‘<a
  3.1341 +    href="#table-footer-group"><code
  3.1342 +    class=css>table-footer-group</code></a>’) P is not a ‘<a
  3.1343 +    href="#table-row"><code class=css>table-row</code></a>’ box, a box
  3.1344 +    corresponding to a ‘<a href="#table-row"><code
  3.1345 +    class=css>table-row</code></a>’ element will be generated between P and
  3.1346 +    T. This box spans all consecutive siblings of T that are not ‘<a
  3.1347 +    href="#table-row"><code class=css>table-row</code></a>’ boxes.
  3.1348 +
  3.1349 +   <li>If a child T of a ‘<a href="#table-row"><code
  3.1350 +    class=css>table-row</code></a>’ box P is not a ‘<a
  3.1351 +    href="#table-cell"><code class=css>table-cell</code></a>’ box, a box
  3.1352 +    corresponding to a ‘<a href="#table-cell"><code
  3.1353 +    class=css>table-cell</code></a>’ element will be generated between P
  3.1354 +    and T. This box spans all consecutive siblings of T that are not ‘<a
  3.1355 +    href="#table-cell"><code class=css>table-cell</code></a>’ boxes.
  3.1356 +  </ol>
  3.1357 +
  3.1358 +  <div class=example>
  3.1359 +   <p>In this XML example, a ‘<a href="#table"><code
  3.1360 +    class=css>table</code></a>’ element is assumed to contain the HBOX
  3.1361 +    element:
  3.1362 +
  3.1363 +   <pre>
  3.1364 +&lt;HBOX&gt;
  3.1365 +  &lt;VBOX&gt;George&lt;/VBOX&gt;
  3.1366 +  &lt;VBOX&gt;4287&lt;/VBOX&gt;
  3.1367 +  &lt;VBOX&gt;1998&lt;/VBOX&gt;
  3.1368 +&lt;/HBOX&gt;
  3.1369 +</pre>
  3.1370 +
  3.1371 +   <p>because the associated style sheet is:
  3.1372 +
  3.1373 +   <pre>
  3.1374 +HBOX { display: table-row }
  3.1375 +VBOX { display: table-cell }
  3.1376 +</pre>
  3.1377 +  </div>
  3.1378 +
  3.1379 +  <div class=example>
  3.1380 +   <p>In this example, three ‘<a href="#table-cell"><code
  3.1381 +    class=css>table-cell</code></a>’ elements are assumed to contain the
  3.1382 +    text in the ROWs. Note that the text is further encapsulated in anonymous
  3.1383 +    inline boxes, as explained in <span class=issue>[where?]</span>:
  3.1384 +
  3.1385 +   <pre class=xml-example>
  3.1386 +&lt;STACK&gt;
  3.1387 +  &lt;ROW&gt;This is the &lt;D&gt;top&lt;/D&gt; row.&lt;/ROW&gt;
  3.1388 +  &lt;ROW&gt;This is the &lt;D&gt;middle&lt;/D&gt; row.&lt;/ROW&gt;
  3.1389 +  &lt;ROW&gt;This is the &lt;D&gt;bottom&lt;/D&gt; row.&lt;/ROW&gt;
  3.1390 +&lt;/STACK&gt;
  3.1391 +</pre>
  3.1392 +
  3.1393 +   <p>The style sheet is:
  3.1394 +
  3.1395 +   <pre>
  3.1396 +STACK { display: inline-table }
  3.1397 +ROW   { display: table-row }
  3.1398 +D     { display: inline; font-weight: bolder }
  3.1399 +</pre>
  3.1400 +  </div>
  3.1401 +
  3.1402 +  <h2 id=columns><span class=secno>5. </span>Columns</h2>
  3.1403 +
  3.1404 +  <p>Table cells may belong to two contexts: rows and columns. However, in
  3.1405 +   the source document cells are descendants of rows, never of columns.
  3.1406 +   Nevertheless, some aspects of cells can be influenced by setting
  3.1407 +   properties on columns.
  3.1408 +
  3.1409 +  <p>The following properties apply to column and column-group elements:
  3.1410 +
  3.1411 +  <dl>
  3.1412 +   <dt>‘<a href="#border"><code class=property>border</code></a>’
  3.1413 +
  3.1414 +   <dd>The various border properties apply to columns only if ‘<a
  3.1415 +    href="#border-collapse"><code
  3.1416 +    class=property>border-collapse</code></a>’ is set to ‘<code
  3.1417 +    class=css>collapse</code>’ on the table element. In that case, borders
  3.1418 +    set on columns and column groups are input to the <a
  3.1419 +    href="#border-conflict-resolution">conflict resolution algorithm</a> that
  3.1420 +    selects the border styles at every cell edge.
  3.1421 +
  3.1422 +   <dt>‘<a href="#background"><code class=property>background</code></a>’
  3.1423 +
  3.1424 +   <dd>The background properties set the background for cells in the column,
  3.1425 +    but only if both the cell and row have transparent backgrounds. See <a
  3.1426 +    href="#table-layers">“Table layers and transparency.”</a>
  3.1427 +
  3.1428 +   <dt>‘<a href="#width"><code class=property>width</code></a>’
  3.1429 +
  3.1430 +   <dd>The ‘<a href="#width"><code class=property>width</code></a>’
  3.1431 +    property gives the minimum width for the column.
  3.1432 +
  3.1433 +   <dt>‘<a href="#visibility"><code class=property>visibility</code></a>’
  3.1434 +
  3.1435 +   <dd>If the ‘<a href="#visibility"><code
  3.1436 +    class=property>visibility</code></a>’ of a column is set to ‘<code
  3.1437 +    class=css>collapse</code>’, none of the cells in the column are
  3.1438 +    rendered, and cells that span into other columns are clipped. In
  3.1439 +    addition, the width of the table is diminished by the width the column
  3.1440 +    would have taken up. See <a href="#dynamic-effects">“Dynamic
  3.1441 +    effects”</a> below. Other values for ‘<a href="#visibility"><code
  3.1442 +    class=property>visibility</code></a>’ have no effect.
  3.1443 +  </dl>
  3.1444 +
  3.1445 +  <div class=example>
  3.1446 +   <p>Here are some examples of style rules that set properties on columns.
  3.1447 +    The first two rules together implement the "rules" attribute of HTML 4
  3.1448 +    with a value of "cols". The third rule makes the "totals" column blue,
  3.1449 +    the final two rules shows how to make a column a fixed size, by using the
  3.1450 +    <a href="#fixed-table-layout">fixed layout algorithm</a>.
  3.1451 +
  3.1452 +   <pre>
  3.1453 +col { border-style: none solid }
  3.1454 +table { border-style: hidden }
  3.1455 +col.totals { background: blue }
  3.1456 +table { table-layout: fixed }
  3.1457 +col.totals { width: 5em }
  3.1458 +</pre>
  3.1459 +  </div>
  3.1460 +
  3.1461 +  <h2 id=model><span class=secno>6. </span>Tables in the visual formatting
  3.1462 +   model</h2>
  3.1463 +
  3.1464 +  <p>In terms of the visual formatting model (<a href="#CSS3BOX"
  3.1465 +   rel=biblioentry>[CSS3BOX]<!--{{!CSS3BOX}}--></a>), a table can behave like
  3.1466 +   a <em>block-level</em> (for ‘<code class=css>display: table</code>’)
  3.1467 +   or <em>inline-level</em> (for ‘<code class=css>display:
  3.1468 +   inline-table</code>’) element.
  3.1469 +
  3.1470 +  <p>In both cases, the table box generates an anonymous box that contains
  3.1471 +   the table box itself and any caption boxes (in document order), except
  3.1472 +   those with ‘<a href="#caption-side"><code
  3.1473 +   class=property>caption-side</code></a>’ set to ‘<code
  3.1474 +   class=css>top-outside</code>’ or ‘<code
  3.1475 +   class=css>bottom-outside</code>’. The caption boxes are block-level
  3.1476 +   boxes that retain their own content, padding, margin, and border areas,
  3.1477 +   and are rendered as normal blocks inside the anonymous box. Whether the
  3.1478 +   caption boxes are placed before or after the table box is decided by the
  3.1479 +   ‘<a href="#caption-side"><code class=property>caption-side</code></a>’
  3.1480 +   property, as described below.
  3.1481 +
  3.1482 +  <p>The anonymous box is a ‘<code class=css>block</code>’ box if the
  3.1483 +   table is block-level, and an ‘<code class=css>inline-block</code>’ box
  3.1484 +   if the table is inline-level, except that this block is never considered
  3.1485 +   as a block for ‘<code class=css>run-in</code>’ interaction, and that
  3.1486 +   the table box (not the anonymous box) is used when doing baseline vertical
  3.1487 +   alignment for an ‘<a href="#inline-table"><code
  3.1488 +   class=css>inline-table</code></a>’. The width of the anonymous box is
  3.1489 +   the border-edge width of the table box inside it, as described by <a
  3.1490 +   href="#width-layout">section [??]</a>. Percentages on ‘<a
  3.1491 +   href="#width"><code class=property>width</code></a>’ on the table are
  3.1492 +   relative to the anonymous box's containing block, not the anonymous box
  3.1493 +   itself.
  3.1494 +
  3.1495 +  <p>The computed values of properties ‘<code
  3.1496 +   class=property>position</code>’, ‘<code
  3.1497 +   class=property>float</code>’, ‘<code class=css>margin-*</code>’,
  3.1498 +   ‘<a href="#top0"><code class=property>top</code></a>’, ‘<code
  3.1499 +   class=property>right</code>’, ‘<a href="#bottom0"><code
  3.1500 +   class=property>bottom</code></a>’, and ‘<code
  3.1501 +   class=property>left</code>’ on the table box are used on the anonymous
  3.1502 +   box instead of the table box. The table box uses the initial values for
  3.1503 +   those properties.
  3.1504 +
  3.1505 +  <div class=figure>
  3.1506 +   <p><img alt="A table with a caption above it" src=top-caption.png>
  3.1507 +
  3.1508 +   <p class=caption>Diagram of a table with a caption above it; the top
  3.1509 +    margin of the caption is collapsed with the top margin of the table.
  3.1510 +  </div>
  3.1511 +
  3.1512 +  <h3 id=caption-position-and-alignment><span class=secno>6.1. </span>Caption
  3.1513 +   position and alignment</h3>
  3.1514 +
  3.1515 +  <table class=propdef>
  3.1516 +   <tbody>
  3.1517 +    <tr>
  3.1518 +     <td><em>Name:</em>
  3.1519 +
  3.1520 +     <td><dfn id=caption-side>caption-side</dfn>
  3.1521 +
  3.1522 +    <tr>
  3.1523 +     <td><em>Value:</em>
  3.1524 +
  3.1525 +     <td>[ top | bottom | left | right | before | after ] && outside?
  3.1526 +
  3.1527 +    <tr>
  3.1528 +     <td><em>Initial:</em>
  3.1529 +
  3.1530 +     <td>top
  3.1531 +
  3.1532 +    <tr>
  3.1533 +     <td><em>Applies to:</em>
  3.1534 +
  3.1535 +     <td>‘<a href="#table-caption"><code
  3.1536 +      class=property>table-caption</code></a>’ elements
  3.1537 +
  3.1538 +    <tr>
  3.1539 +     <td><em>Inherited:</em>
  3.1540 +
  3.1541 +     <td>yes
  3.1542 +
  3.1543 +    <tr>
  3.1544 +     <td><em>Percentages:</em>
  3.1545 +
  3.1546 +     <td>N/A
  3.1547 +
  3.1548 +    <tr>
  3.1549 +     <td><em>Media:</em>
  3.1550 +
  3.1551 +     <td>visual
  3.1552 +
  3.1553 +    <tr>
  3.1554 +     <td><em>Computed value:</em>
  3.1555 +
  3.1556 +     <td>specified value
  3.1557 +  </table>
  3.1558 +
  3.1559 +  <p>This property specifies the position of the caption box with respect to
  3.1560 +   the table box. Values have the following meanings:
  3.1561 +
  3.1562 +  <dl>
  3.1563 +   <dt><dfn id=top title="top (caption-side)">top</dfn>
  3.1564 +
  3.1565 +   <dd>Positions the caption box above the table box.
  3.1566 +
  3.1567 +   <dt><dfn id=bottom title="bottom (caption-side)">bottom</dfn>
  3.1568 +
  3.1569 +   <dd>Positions the caption box below the table box.
  3.1570 +
  3.1571 +   <dt><dfn id=left title="left (caption-side)">left</dfn>
  3.1572 +
  3.1573 +   <dd>Positions the caption box to the left of the table box.
  3.1574 +
  3.1575 +   <dt><dfn id=right title="right (caption-side)">right</dfn>
  3.1576 +
  3.1577 +   <dd>Positions the caption box to the right of the table box.
  3.1578 +
  3.1579 +   <dt><dfn id=before title="before (caption-side)">before</dfn>
  3.1580 +
  3.1581 +   <dd>The used value depends on the value of the element's ‘<code
  3.1582 +    class=property>writing-mode</code>’:
  3.1583 +    <table class=equiv-table>
  3.1584 +     <thead>
  3.1585 +      <tr>
  3.1586 +       <th>Value of ‘<code class=property>writing-mode</code>’
  3.1587 +
  3.1588 +       <th>Meaning of ‘<code class=css>before</code>’
  3.1589 +
  3.1590 +     <tbody>
  3.1591 +      <tr>
  3.1592 +       <th>‘<code class=css>horizontal-tb</code>’
  3.1593 +
  3.1594 +       <td>‘<a href="#top0"><code class=css>top</code></a>’
  3.1595 +
  3.1596 +      <tr>
  3.1597 +       <th>‘<code class=css>vertical-rl</code>’
  3.1598 +
  3.1599 +       <td>‘<code class=css>right</code>’
  3.1600 +
  3.1601 +      <tr>
  3.1602 +       <th>‘<code class=css>vertical-lr</code>’
  3.1603 +
  3.1604 +       <td>‘<code class=css>left</code>’
  3.1605 +    </table>
  3.1606 +
  3.1607 +   <dt><dfn id=after title="after (caption-side)">after</dfn>
  3.1608 +
  3.1609 +   <dd>The used value depends on the value of the element's ‘<code
  3.1610 +    class=property>writing-mode</code>’:
  3.1611 +    <table class=equiv-table>
  3.1612 +     <thead>
  3.1613 +      <tr>
  3.1614 +       <th>Value of ‘<code class=property>writing-mode</code>’
  3.1615 +
  3.1616 +       <th>Meaning of ‘<code class=css>after</code>’
  3.1617 +
  3.1618 +     <tbody>
  3.1619 +      <tr>
  3.1620 +       <th>‘<code class=css>horizontal-tb</code>’
  3.1621 +
  3.1622 +       <td>‘<a href="#bottom0"><code class=css>bottom</code></a>’
  3.1623 +
  3.1624 +      <tr>
  3.1625 +       <th>‘<code class=css>vertical-rl</code>’
  3.1626 +
  3.1627 +       <td>‘<code class=css>left</code>’
  3.1628 +
  3.1629 +      <tr>
  3.1630 +       <th>‘<code class=css>vertical-lr</code>’
  3.1631 +
  3.1632 +       <td>‘<code class=css>right</code>’
  3.1633 +    </table>
  3.1634 +  </dl>
  3.1635 +
  3.1636 +  <p>Captions with the extra keyword ‘<code class=css>outside</code>’ are
  3.1637 +   formatted very much as if they were a block element before or after the
  3.1638 +   table, except that (1) they inherit inheritable properties from the table,
  3.1639 +   and (2) they are not considered to be a block box for the purposes of any
  3.1640 +   ‘<code class=css>compact</code>’ or ‘<code
  3.1641 +   class=css>run-in</code>’ element that may precede the table.
  3.1642 +
  3.1643 +  <p>Such a caption also behaves like a block box for width and height
  3.1644 +   calculations; the width and height are calculated with respect to the
  3.1645 +   table box's containing block.
  3.1646 +
  3.1647 +  <p>For a caption that is on the left or right side of a table box, on the
  3.1648 +   other hand, a value other than ‘<code class=css>auto</code>’ for ‘<a
  3.1649 +   href="#width"><code class=property>width</code></a>’ sets the width
  3.1650 +   explicitly, but ‘<code class=css>auto</code>’ tells the user agent to
  3.1651 +   chose a “reasonable width.” This may vary between “the narrowest
  3.1652 +   possible box” to “a single line,” so we recommend that users do not
  3.1653 +   specify ‘<code class=css>auto</code>’ for left and right caption
  3.1654 +   widths.
  3.1655 +
  3.1656 +  <p>To align caption content horizontally within the caption box, use the
  3.1657 +   ‘<a href="#text-align"><code class=property>text-align</code></a>’
  3.1658 +   property.
  3.1659 +
  3.1660 +  <p>For vertical alignment of a left or right caption box with respect to
  3.1661 +   the table box, use the ‘<a href="#vertical-align"><code
  3.1662 +   class=property>vertical-align</code></a>’ property. The only meaningful
  3.1663 +   values in this case are ‘<a href="#top0"><code
  3.1664 +   class=css>top</code></a>’, ‘<a href="#middle"><code
  3.1665 +   class=css>middle</code></a>’, and ‘<a href="#bottom0"><code
  3.1666 +   class=css>bottom</code></a>’. All other values are treated the same as
  3.1667 +   ‘<a href="#top0"><code class=css>top</code></a>’.
  3.1668 +
  3.1669 +  <p>All left captions are displayed side by side (left margin edge of the
  3.1670 +   first against right margin edge of the next, etc.).
  3.1671 +
  3.1672 +  <div class=example>
  3.1673 +   <p>In this example, the ‘<a href="#caption-side"><code
  3.1674 +    class=property>caption-side</code></a>’ property places captions below
  3.1675 +    tables. The caption will be as wide as the parent of the table, and
  3.1676 +    caption text will be left-justified.
  3.1677 +
  3.1678 +   <pre>
  3.1679 +caption { caption-side: bottom; 
  3.1680 +          width: auto;
  3.1681 +          text-align: left }
  3.1682 +</pre>
  3.1683 +  </div>
  3.1684 +
  3.1685 +  <div class=example>
  3.1686 +   <p>The following example shows how to put a caption in the left margin.
  3.1687 +    The table itself is centered, by setting its left and right margins to
  3.1688 +    ‘<code class=property>auto</code>’, and the whole box with table and
  3.1689 +    caption is shifted into the left margin by the same amount as the width
  3.1690 +    of the caption.
  3.1691 +
  3.1692 +   <pre>
  3.1693 +body {
  3.1694 +    margin-left: 8em }
  3.1695 +table {
  3.1696 +    margin-left: auto;
  3.1697 +    margin-right: auto }
  3.1698 +caption {
  3.1699 +    caption-side: left;
  3.1700 +    margin-left: -8em;
  3.1701 +    width: 8em;
  3.1702 +    text-align: right;
  3.1703 +    vertical-align: bottom }
  3.1704 +</pre>
  3.1705 +
  3.1706 +   <p>Assuming the width of the table is less than the available width, the
  3.1707 +    formatting will be similar to this:
  3.1708 +
  3.1709 +   <div class=figure>
  3.1710 +    <p><img
  3.1711 +     alt="A centered table with a caption in the left margin of the page"
  3.1712 +     src=left-caption>
  3.1713 +
  3.1714 +    <p class=caption>Diagram showing a centered table with the caption
  3.1715 +     extending into the left margin, as a result of a negative ‘<code
  3.1716 +     class=property>margin-left</code>’ property.
  3.1717 +   </div>
  3.1718 +   <!-- figure --></div>
  3.1719 +  <!-- example -->
  3.1720 +
  3.1721 +  <h2 id=Visual><span class=secno>7. </span>Visual layout of table contents</h2>
  3.1722 +
  3.1723 +  <p>Internal table elements generate rectangular boxes with content and
  3.1724 +   borders. Cells have padding as well. Internal table elements do not have
  3.1725 +   margins.
  3.1726 +
  3.1727 +  <p>The visual layout of these boxes is governed by a rectangular, irregular
  3.1728 +   grid of rows and columns. Each box occupies a whole number of grid cells,
  3.1729 +   determined according to the following rules. These rules do not apply to
  3.1730 +   HTML 4 or earlier HTML versions; HTML imposes its own limitations on row
  3.1731 +   and column spans.
  3.1732 +
  3.1733 +  <ol>
  3.1734 +   <li>Each row box occupies one row of grid cells. Together, the row boxes
  3.1735 +    fill the table from top to bottom in the order they occur in the source
  3.1736 +    document (i.e., the table occupies exactly as many grid rows as there are
  3.1737 +    row elements).
  3.1738 +
  3.1739 +   <li>A row group occupies the same grid cells as the rows it contains.
  3.1740 +
  3.1741 +   <li>A column box occupies one or more columns of grid cells. Column boxes
  3.1742 +    are placed next to each other in the order they occur. The first column
  3.1743 +    box may be either on the left or on the right, depending on the value of
  3.1744 +    the ‘<a href="#direction"><code class=property>direction</code></a>’
  3.1745 +    property of the table.
  3.1746 +
  3.1747 +   <li>A column group box occupies the same grid cells as the columns it
  3.1748 +    contains.
  3.1749 +
  3.1750 +   <li>Cells may span several rows or columns. (See ‘<code
  3.1751 +    class=property>row-span</code>’.) Each cell is thus a rectangular box,
  3.1752 +    one or more grid cells wide and high. The top row of this rectangle is in
  3.1753 +    the row specified by the cell's parent. The rectangle must be as far to
  3.1754 +    the left as possible, but it may not overlap with any other cell box, and
  3.1755 +    must be to the right of all cells in the same row that are earlier in the
  3.1756 +    source document. (This constraint holds if the ‘<a
  3.1757 +    href="#direction"><code class=property>direction</code></a>’ property
  3.1758 +    of the table is ‘<code class=property>ltr</code>’; if the ‘<a
  3.1759 +    href="#direction"><code class=property>direction</code></a>’ is
  3.1760 +    ‘<code class=property>rtl</code>’, interchange“left” and
  3.1761 +    “right” in the previous sentence.)
  3.1762 +
  3.1763 +   <li>A cell box cannot extend beyond the last row box of a table or
  3.1764 +    row-group; the user agents must shorten it until it fits.
  3.1765 +  </ol>
  3.1766 +
  3.1767 +  <p>The edges of the rows, columns, row groups and column groups in the <a
  3.1768 +   href="#collapsing-borders">collapsing borders model</a> coincide with the
  3.1769 +   hypothetical grid lines on which the borders of the cells are centered.
  3.1770 +   (And thus, in this model, the rows together exactly cover the table,
  3.1771 +   leaving no gaps; ditto for the columns.) In the <a
  3.1772 +   href="#separated-borders">separated borders model,</a> the edges coincide
  3.1773 +   with the <em title="border edge">border edges</em> of cells. (And thus, in
  3.1774 +   this model, there may be gaps between the rows, columns, row groups or
  3.1775 +   column groups, corresponding to the ‘<a href="#border-spacing"><code
  3.1776 +   class=property>border-spacing</code></a>’ property.)
  3.1777 +
  3.1778 +  <div class=note>
  3.1779 +   <p><strong>Note.</strong> Positioning and floating of table cells can
  3.1780 +    cause them not to be table cells anymore, according to the rules in <a
  3.1781 +    href="??">[Relationships between ‘<code
  3.1782 +    class=property>display</code>’, ‘<code
  3.1783 +    class=property>position</code>’, and ‘<code
  3.1784 +    class=property>float</code>’]</a>. When floating is used, the rules on
  3.1785 +    <a href="#anonymous-boxes">anonymous table objects</a> may cause an
  3.1786 +    anonymous cell object to be created as well.
  3.1787 +  </div>
  3.1788 +
  3.1789 +  <div class=html-example>
  3.1790 +   <p>Here are two examples. The first is assumed to occur in an HTML
  3.1791 +    document, the second an XHTML document:
  3.1792 +
  3.1793 +   <pre>
  3.1794 +&lt;TABLE&gt;
  3.1795 +&lt;TR&gt;&lt;TD&gt;1 &lt;TD rowspan="2"&gt;2 &lt;TD&gt;3 &lt;TD&gt;4
  3.1796 +&lt;TR&gt;&lt;TD colspan="2"&gt;5
  3.1797 +&lt;/TABLE&gt;
  3.1798 +</pre>
  3.1799 +
  3.1800 +   <pre>
  3.1801 +&lt;table&gt;
  3.1802 +&lt;tr&gt;&lt;td&gt;1 &lt;/td&gt;&lt;td rowspan="2"&gt;2 &lt;/td&gt;&lt;td&gt;3 &lt;/td&gt;&lt;td&gt;4 &lt;/td&gt;&lt;/tr&gt;
  3.1803 +&lt;tr&gt;&lt;td colspan="2"&gt;5 &lt;/td&gt;&lt;/tr&gt;
  3.1804 +&lt;/table&gt;
  3.1805 +</pre>
  3.1806 +
  3.1807 +   <p>The second is formatted as in the figure on the right. However, the
  3.1808 +    HTML table's rendering is explicitly undefined by HTML, and CSS doesn't
  3.1809 +    try to define it. User agents are free to render it, e.g., as in the
  3.1810 +    figure on the left.
  3.1811 +
  3.1812 +   <div class=figure>
  3.1813 +    <p><img alt="One table with overlapping cells and one without"
  3.1814 +     src=table-overlap>
  3.1815 +
  3.1816 +    <p class=caption>On the left, one possible rendering of an erroneous
  3.1817 +     HTML 4 table; on the right, the only possible formatting of a similar
  3.1818 +     XHTML table.
  3.1819 +   </div>
  3.1820 +  </div>
  3.1821 +
  3.1822 +  <h3 id=table-layers><span class=secno>7.1. </span>Table layers and
  3.1823 +   transparency</h3>
  3.1824 +
  3.1825 +  <p>For the purposes of finding the background of each table cell, the
  3.1826 +   different table elements may be thought of as being on six superimposed
  3.1827 +   layers. The background set on an element in one of the layers will only be
  3.1828 +   visible if the layers above it have a transparent background.
  3.1829 +
  3.1830 +  <div class=figure>
  3.1831 +   <p><img alt="schema of table layers" src=tbl-layers.png>
  3.1832 +
  3.1833 +   <p class=caption>Schema of table layers.
  3.1834 +  </div>
  3.1835 +
  3.1836 +  <ol>
  3.1837 +   <li>The lowest layer is a single plane, representing the table box itself.
  3.1838 +    Like all boxes, it may be transparent.
  3.1839 +
  3.1840 +   <li>The next layer contains the column groups. Each column group extends
  3.1841 +    from the top of the cells in the top row to the bottom of the cells on
  3.1842 +    the bottom row and from the left edge of its leftmost column to the right
  3.1843 +    edge of its rightmost column. The background extends to cover the full
  3.1844 +    area of all cells that originate in the column group, but this extension
  3.1845 +    does not affect background image positioning.
  3.1846 +
  3.1847 +   <li>On top of the column groups are the areas representing the column
  3.1848 +    boxes. Each column is as tall as the column groups and as wide as a
  3.1849 +    normal (single-column-spanning) cell in the column. The background
  3.1850 +    extends to cover the full area of all cells that originate in the column,
  3.1851 +    even if they span outside the column, but this extension does not affect
  3.1852 +    background image positioning.
  3.1853 +
  3.1854 +   <li>Next is the layer containing the row groups. Each row group extends
  3.1855 +    from the top left corner of its topmost cell in the first column to the
  3.1856 +    bottom right corner of its bottommost cell in the last column.
  3.1857 +
  3.1858 +   <li>The next to last layer contains the rows. Each row is as wide as the
  3.1859 +    row groups and as tall as a normal (single-row-spanning) cell in the row.
  3.1860 +    As with columns, the background extends to cover the full area of all
  3.1861 +    cells that originate in the row, even if they span outside the row, but
  3.1862 +    this extension does not affect background image positioning.
  3.1863 +
  3.1864 +   <li>The topmost layer contains the cells themselves. As the figure shows,
  3.1865 +    although all rows contain the same number of cells, not every cell may
  3.1866 +    have specified content. If the value of their ‘<a
  3.1867 +    href="#empty-cells0"><code class=property>empty-cells</code></a>’
  3.1868 +    property is ‘<code class=property>hide</code>’ these “empty”
  3.1869 +    cells are transparent through the cell, row, row group, column and column
  3.1870 +    group backgrounds, letting the table background show through.
  3.1871 +  </ol>
  3.1872 +
  3.1873 +  <div class=html-example>
  3.1874 +   <p>In the following example, the first row contains four cells, but the
  3.1875 +    second row contains no cells, and thus the table background shines
  3.1876 +    through, except where a cell from the first row spans into this row. The
  3.1877 +    following HTML code and style rules.
  3.1878 +
  3.1879 +   <pre>
  3.1880 +&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"&gt;
  3.1881 +&lt;HTML&gt;
  3.1882 +  &lt;HEAD&gt;
  3.1883 +    &lt;TITLE&gt;Table example&lt;/TITLE&gt;
  3.1884 +    &lt;STYLE type="text/css"&gt;
  3.1885 +      TABLE { background: #ff0; border-collapse: collapse;
  3.1886 +              empty-cells: hide }
  3.1887 +      TD    { background: red; border: double black }
  3.1888 +    &lt;/STYLE&gt;
  3.1889 +  &lt;/HEAD&gt;
  3.1890 +  &lt;BODY&gt;
  3.1891 +    &lt;TABLE&gt;
  3.1892 +      &lt;TR&gt;
  3.1893 +        &lt;TD&gt; 1 
  3.1894 +        &lt;TD rowspan="2"&gt; 2
  3.1895 +        &lt;TD&gt; 3 
  3.1896 +        &lt;TD&gt; 4 
  3.1897 +      &lt;/TR&gt;
  3.1898 +      &lt;TR&gt;&lt;TD&gt;&lt;/TD&gt;&lt;/TR&gt;
  3.1899 +    &lt;/TABLE&gt; 
  3.1900 +  &lt;/BODY&gt;
  3.1901 +&lt;/HTML&gt;
  3.1902 +</pre>
  3.1903 +
  3.1904 +   <p>might be formatted as follows:
  3.1905 +
  3.1906 +   <div class=figure>
  3.1907 +    <p><img alt="Table with three empty cells in   bottom row"
  3.1908 +     src=tbl-empty.png>
  3.1909 +
  3.1910 +    <p class=caption>Table with three empty cells in the bottom row.
  3.1911 +   </div>
  3.1912 +  </div>
  3.1913 +
  3.1914 +  <p>Note that if the table has ‘<code class=css>border-collapse:
  3.1915 +   separate</code>’, the background of the area given by the ‘<a
  3.1916 +   href="#border-spacing"><code class=property>border-spacing</code></a>’
  3.1917 +   property is always the background of the table element. See <a
  3.1918 +   href="#separated-borders">the separated borders model</a>.
  3.1919 +
  3.1920 +  <h3 id=width-layout><span class=secno>7.2. </span>Table width algorithms:
  3.1921 +   the ‘<a href="#table-layout"><code
  3.1922 +   class=property>table-layout</code></a>’ property</h3>
  3.1923 +
  3.1924 +  <p>CSS does not define an “optimal” layout for tables since, in many
  3.1925 +   cases, what is optimal is a matter of taste. CSS does define constraints
  3.1926 +   that user agents must respect when laying out a table. User agents may use
  3.1927 +   any algorithm they wish to do so, and are free to prefer rendering speed
  3.1928 +   over precision, except when the “fixed layout algorithm” is selected.
  3.1929 +
  3.1930 +  <p>Note that this section overrides the rules that apply to calculating
  3.1931 +   widths as described in <a href="#CSS3BOX"
  3.1932 +   rel=biblioentry>[CSS3BOX]<!--{{!CSS3BOX}}--></a>. In particular, if the
  3.1933 +   margins of a table are set to ‘<code class=css>0</code>’ and the width
  3.1934 +   to ‘<code class=css>auto</code>’, the table will not automatically
  3.1935 +   size to fill its containing block. However, once the calculated value of
  3.1936 +   ‘<a href="#width"><code class=property>width</code></a>’ for the table
  3.1937 +   is found (using the algorithms given below or, when appropriate, some
  3.1938 +   other UA dependent algorithm) then the other parts of the algorithm do
  3.1939 +   apply. Therefore a table <em>can</em> be centered using left and right
  3.1940 +   ‘<code class=css>auto</code>’ margins, for instance.
  3.1941 +
  3.1942 +  <p>Future updates of CSS may introduce ways of making tables automatically
  3.1943 +   fit their containing blocks.
  3.1944 +
  3.1945 +  <table class=propdef>
  3.1946 +   <tbody>
  3.1947 +    <tr>
  3.1948 +     <td><em>Name:</em>
  3.1949 +
  3.1950 +     <td><dfn id=table-layout>table-layout</dfn>
  3.1951 +
  3.1952 +    <tr>
  3.1953 +     <td><em>Value:</em>
  3.1954 +
  3.1955 +     <td>auto | fixed
  3.1956 +
  3.1957 +    <tr>
  3.1958 +     <td><em>Initial:</em>
  3.1959 +
  3.1960 +     <td>auto
  3.1961 +
  3.1962 +    <tr>
  3.1963 +     <td><em>Applies to:</em>
  3.1964 +
  3.1965 +     <td>‘<a href="#table"><code class=property>table</code></a>’ and
  3.1966 +      ‘<a href="#inline-table"><code
  3.1967 +      class=property>inline-table</code></a>’ elements
  3.1968 +
  3.1969 +    <tr>
  3.1970 +     <td><em>Inherited:</em>
  3.1971 +
  3.1972 +     <td>no
  3.1973 +
  3.1974 +    <tr>
  3.1975 +     <td><em>Percentages:</em>
  3.1976 +
  3.1977 +     <td>N/A
  3.1978 +
  3.1979 +    <tr>
  3.1980 +     <td><em>Media:</em>
  3.1981 +
  3.1982 +     <td>visual
  3.1983 +
  3.1984 +    <tr>
  3.1985 +     <td><em>Computed value:</em>
  3.1986 +
  3.1987 +     <td>specified value
  3.1988 +  </table>
  3.1989 +
  3.1990 +  <p>The ‘<a href="#table-layout"><code
  3.1991 +   class=property>table-layout</code></a>’ property controls the algorithm
  3.1992 +   used to lay out the table cells, rows, and columns. Values have the
  3.1993 +   following meaning:
  3.1994 +
  3.1995 +  <dl>
  3.1996 +   <dt><dfn id=fixed>fixed</dfn>
  3.1997 +
  3.1998 +   <dd>Use the fixed table layout algorithm
  3.1999 +
  3.2000 +   <dt><dfn id=auto title="auto (table-layout)">auto</dfn>
  3.2001 +
  3.2002 +   <dd>Use any automatic table layout algorithm
  3.2003 +  </dl>
  3.2004 +
  3.2005 +  <p>The two algorithms are described below.
  3.2006 +
  3.2007 +  <h4 id=fixed-table-layout><span class=secno>7.2.1. </span>Fixed table
  3.2008 +   layout</h4>
  3.2009 +
  3.2010 +  <p>With this (fast) algorithm, the horizontal layout of the table does not
  3.2011 +   depend on the contents of the cells; it only depends on the table's width,
  3.2012 +   the width of the columns, and borders or cell spacing.
  3.2013 +
  3.2014 +  <p>The table's width may be specified explicitly with the ‘<a
  3.2015 +   href="#width"><code class=property>width</code></a>’ property. A value
  3.2016 +   of ‘<code class=css>auto</code>’ (for both ‘<code class=css>display:
  3.2017 +   table</code>’ and ‘<code class=css>display: inline-table</code>’)
  3.2018 +   means use the <a href="#auto-table-layout">automatic table layout</a>
  3.2019 +   algorithm. However, if the table is a block-level table (‘<code
  3.2020 +   class=css>display: table</code>’) in normal flow, a UA may (but does not
  3.2021 +   have to) use the algorithm of <a
  3.2022 +   href="http://www.w3.org/TR/CSS2/visudet.html#q6">10.3.3</a> [Re-link this
  3.2023 +   to the Box Model] to compute a width and apply fixed table layout even if
  3.2024 +   the specified width is ‘<code class=property>auto</code>’.
  3.2025 +
  3.2026 +  <div class=example>
  3.2027 +   <p>If a UA supports fixed table layout when ‘<a href="#width"><code
  3.2028 +    class=property>width</code></a>’ is ‘<code
  3.2029 +    class=property>auto</code>’, the following will create a table that is
  3.2030 +    4em narrower than its containing block:
  3.2031 +
  3.2032 +   <pre>
  3.2033 +table { table-layout: fixed;
  3.2034 +        margin-left: 2em;
  3.2035 +        margin-right: 2em }
  3.2036 +</pre>
  3.2037 +  </div>
  3.2038 +
  3.2039 +  <p>In the fixed table layout algorithm, the width of each column is
  3.2040 +   determined as follows:
  3.2041 +
  3.2042 +  <ol>
  3.2043 +   <li>A column element with a value other than ‘<code
  3.2044 +    class=property>auto</code>’ for the ‘<a href="#width"><code
  3.2045 +    class=property>width</code></a>’ property sets the width for that
  3.2046 +    column.
  3.2047 +
  3.2048 +   <li>Otherwise, a cell in the first row with a value other than ‘<code
  3.2049 +    class=property>auto</code>’ for the ‘<a href="#width"><code
  3.2050 +    class=property>width</code></a>’ property determines the width for that
  3.2051 +    column. If the cell spans more than one column, the width is divided over
  3.2052 +    the columns.
  3.2053 +
  3.2054 +   <li>Any remaining columns equally divide the remaining horizontal table
  3.2055 +    space (minus borders or cell spacing).
  3.2056 +  </ol>
  3.2057 +
  3.2058 +  <p>The width of the table is then the greater of the value of the ‘<a
  3.2059 +   href="#width"><code class=property>width</code></a>’ property for the
  3.2060 +   table element and the sum of the column widths (plus cell spacing or
  3.2061 +   borders). If the table is wider than the columns, the extra space should
  3.2062 +   be distributed over the columns.
  3.2063 +
  3.2064 +  <p>If a subsequent row has more columns than the first, then additional
  3.2065 +   columns must not be rendered. When using ‘<code class=css>table-layout:
  3.2066 +   fixed</code>’, authors should not omit columns from the first row.
  3.2067 +
  3.2068 +  <p>In this manner, the user agent can begin to lay out the table once the
  3.2069 +   entire first row has been received. Cells in subsequent rows do not affect
  3.2070 +   column widths. Any cell that has content that overflows uses the ‘<a
  3.2071 +   href="#overflow"><code class=property>overflow</code></a>’ property to
  3.2072 +   determine whether to clip the overflow content.
  3.2073 +
  3.2074 +  <h4 id=auto-table-layout><span class=secno>7.2.2. </span>Automatic table
  3.2075 +   layout</h4>
  3.2076 +
  3.2077 +  <p>In this algorithm (which generally requires no more than two passes),
  3.2078 +   the table's width is given by the width of its columns (and intervening <a
  3.2079 +   href="#borders">borders</a>). This algorithm reflects the behavior of
  3.2080 +   several popular HTML user agents at the writing of this specification. UAs
  3.2081 +   are not required to implement this algorithm to determine the table layout
  3.2082 +   in the case that <a class=propinst-table-layout
  3.2083 +   href="#table-layout">‘<code class=property>table-layout</code>’</a> is
  3.2084 +   ‘<code class=property>auto</code>’; they can use any other algorithm
  3.2085 +   even if it results in different behavior.
  3.2086 +
  3.2087 +  <p>Input to the automatic table layout must only include the width of the
  3.2088 +   containing block and the content of, and any CSS properties set on, the
  3.2089 +   table and any of its descendants.
  3.2090 +
  3.2091 +  <div class=issue>
  3.2092 +   <p>This should be defined in more detail.
  3.2093 +  </div>
  3.2094 +
  3.2095 +  <p><em>The remainder of this section is non-normative.</em>
  3.2096 +
  3.2097 +  <p>This algorithm may be inefficient since it requires the user agent to
  3.2098 +   have access to all the content in the table before determining the final
  3.2099 +   layout and may demand more than one pass.
  3.2100 +
  3.2101 +  <p>Column widths are determined as follows:
  3.2102 +
  3.2103 +  <ol>
  3.2104 +   <li>
  3.2105 +    <p>Calculate the minimum content width (MCW) of each cell: the formatted
  3.2106 +     content may span any number of lines but may not overflow the cell box.
  3.2107 +     If the specified ‘<a href="#width"><code
  3.2108 +     class=property>width</code></a>’ (W) of the cell is greater than MCW,
  3.2109 +     W is the minimum cell width. A value of ‘<code
  3.2110 +     class=css>auto</code>’ means that MCW is the minimum cell width.
  3.2111 +
  3.2112 +    <p>Also, calculate the "maximum" cell width of each cell: formatting the
  3.2113 +     content without breaking lines other than where explicit line breaks
  3.2114 +     occur.
  3.2115 +
  3.2116 +   <li>
  3.2117 +    <p>For each column, determine a maximum and minimum column width from the
  3.2118 +     cells that span only that column. The minimum is that required by the
  3.2119 +     cell with the largest minimum cell width (or the column ‘<a
  3.2120 +     href="#width"><code class=property>width</code></a>’, whichever is
  3.2121 +     larger). The maximum is that required by the cell with the largest
  3.2122 +     maximum cell width (or the column ‘<a href="#width"><code
  3.2123 +     class=property>width</code></a>’, whichever is larger).
  3.2124 +
  3.2125 +   <li>
  3.2126 +    <p>For each cell that spans more than one column, increase the minimum
  3.2127 +     widths of the columns it spans so that together, they are at least as
  3.2128 +     wide as the cell. Do the same for the maximum widths. If possible, widen
  3.2129 +     all spanned columns by approximately the same amount.
  3.2130 +
  3.2131 +   <li>
  3.2132 +    <p>For each column group element with a ‘<a href="#width"><code
  3.2133 +     class=property>width</code></a>’ other than ‘<code
  3.2134 +     class=css>auto</code>’, increase the minimum widths of the columns it
  3.2135 +     spans, so that together they are at least as wide as the column group's
  3.2136 +     ‘<a href="#width"><code class=property>width</code></a>’.
  3.2137 +  </ol>
  3.2138 +
  3.2139 +  <p>This gives a maximum and minimum width for each column. Column widths
  3.2140 +   influence the final table width as follows:
  3.2141 +
  3.2142 +  <ol>
  3.2143 +   <li>If the ‘<a href="#table"><code class=property>table</code></a>’ or
  3.2144 +    ‘<a href="#inline-table"><code
  3.2145 +    class=property>inline-table</code></a>’ element's ‘<a
  3.2146 +    href="#width"><code class=property>width</code></a>’ property has a
  3.2147 +    computed value (W) other than ‘<code class=property>auto</code>’, the
  3.2148 +    property's value as used for layout is the greater of W and the minimum
  3.2149 +    width required by all the columns plus cell spacing or borders (MIN). If
  3.2150 +    W is greater than MIN, the extra width should be distributed over the
  3.2151 +    columns.
  3.2152 +
  3.2153 +   <li>If the ‘<a href="#table"><code class=css>table</code></a>’ or
  3.2154 +    ‘<a href="#inline-table"><code class=css>inline-table</code></a>’
  3.2155 +    element has ‘<code class=css>width: auto</code>’, the table width
  3.2156 +    used for layout is the greater of the table's containing block width and
  3.2157 +    MIN. However, if the maximum width required by the columns plus cell
  3.2158 +    spacing or borders (MAX) is less than that of the containing block, use
  3.2159 +    MAX.
  3.2160 +  </ol>
  3.2161 +
  3.2162 +  <p>A percentage value for a column width is relative to the table width. If
  3.2163 +   the table has ‘<code class=css>width: auto</code>’, a percentage
  3.2164 +   represents a constraint on the column's width, which a UA should try to
  3.2165 +   satisfy. (Obviously, this is not always possible: if the column's width is
  3.2166 +   ‘<code class=css>110%</code>’, the constraint cannot be satisfied.)
  3.2167 +
  3.2168 +  <p class=note>In this algorithm, rows (and row groups) and columns (and
  3.2169 +   column groups) both constrain and are constrained by the dimensions of the
  3.2170 +   cells they contain. Setting the width of a column may indirectly influence
  3.2171 +   the height of a row, and vice versa.
  3.2172 +
  3.2173 +  <h3 id=height-layout><span class=secno>7.3. </span>Table height algorithms</h3>
  3.2174 +
  3.2175 +  <p>The height of a table is given by the ‘<a href="#height"><code
  3.2176 +   class=property>height</code></a>’ property for the ‘<a
  3.2177 +   href="#table"><code class=property>table</code></a>’ or ‘<a
  3.2178 +   href="#inline-table"><code class=property>inline-table</code></a>’
  3.2179 +   element. A value of ‘<code class=property>auto</code>’ means that the
  3.2180 +   height is the sum of the row heights plus any cell spacing or borders. Any
  3.2181 +   other value specifies the height explicitly; the table may thus be taller
  3.2182 +   or shorter than the height of its rows. The ‘<a href="#height"><code
  3.2183 +   class=property>height</code></a>’ property on ‘<a href="#table"><code
  3.2184 +   class=css>table</code></a>’ boxes is treated as a minimum height. CSS3
  3.2185 +   does not define how extra space is distributed when the ‘<a
  3.2186 +   href="#height"><code class=property>height</code></a>’ property causes
  3.2187 +   the table to be taller than it otherwise would be. <span
  3.2188 +   class=issue>Specify this?</span>
  3.2189 +
  3.2190 +  <p>The height of a ‘<a href="#table-row"><code
  3.2191 +   class=css>table-row</code></a>’ element's box is calculated once the
  3.2192 +   user agent has all the cells in the row available: it is the maximum of
  3.2193 +   the row's specified ‘<a href="#height"><code
  3.2194 +   class=property>height</code></a>’ and the minimum height (MIN) required
  3.2195 +   by the cells. A ‘<a href="#height"><code
  3.2196 +   class=property>height</code></a>’ value of ‘<code
  3.2197 +   class=property>auto</code>’ for a ‘<a href="#table-row"><code
  3.2198 +   class=css>table-row</code></a>’ means the row height used for layout is
  3.2199 +   MIN. MIN depends on cell box heights and cell box alignment (much like the
  3.2200 +   calculation of a <em>line box</em> height). Percentage heights on table
  3.2201 +   cells, table rows, and table row groups compute to ‘<code
  3.2202 +   class=css>auto</code>’.
  3.2203 +
  3.2204 +  <p>In CSS3, the height of a cell box is the maximum of the table cell's
  3.2205 +   ‘<a href="#height"><code class=property>height</code></a>’ property
  3.2206 +   and the minimum height required by the content (MIN). A value of ‘<code
  3.2207 +   class=property>auto</code>’ for ‘<a href="#height"><code
  3.2208 +   class=property>height</code></a>’ implies that the value MIN will be
  3.2209 +   used for layout. CSS3 does not define what percentage values of ‘<a
  3.2210 +   href="#height"><code class=property>height</code></a>’ refer to when
  3.2211 +   specified for table cells.
  3.2212 +
  3.2213 +  <p>CSS3 does not specify how cells that span more than one row affect row
  3.2214 +   height calculations except that the sum of the row heights involved must
  3.2215 +   be great enough to encompass the cell spanning the rows.
  3.2216 +
  3.2217 +  <p>The ‘<a href="#vertical-align"><code
  3.2218 +   class=property>vertical-align</code></a>’ property of each table cell
  3.2219 +   determines its alignment within the row. Each cell's content has a
  3.2220 +   baseline, a top, a middle, and a bottom, as does the row itself. In the
  3.2221 +   context of tables, values for ‘<a href="#vertical-align"><code
  3.2222 +   class=property>vertical-align</code></a>’ have the following meanings:
  3.2223 +
  3.2224 +  <dl>
  3.2225 +   <dt><dfn id=baseline>baseline</dfn>
  3.2226 +
  3.2227 +   <dd>The baseline of the cell is put at the same height as the baseline of
  3.2228 +    the first of the rows it spans (see below for the definition of baselines
  3.2229 +    of cells and rows).
  3.2230 +
  3.2231 +   <dt><dfn id=top0>top</dfn>
  3.2232 +
  3.2233 +   <dd>The top of the cell box is aligned with the top of the first row it
  3.2234 +    spans.
  3.2235 +
  3.2236 +   <dt><dfn id=bottom0>bottom</dfn>
  3.2237 +
  3.2238 +   <dd>The bottom of the cell box is aligned with the bottom of the last row
  3.2239 +    it spans.
  3.2240 +
  3.2241 +   <dt><dfn id=middle>middle</dfn>
  3.2242 +
  3.2243 +   <dd>The center of the cell is aligned with the center of the rows it
  3.2244 +    spans.
  3.2245 +
  3.2246 +   <dt>sub,
  3.2247 +
  3.2248 +   <dt>super,
  3.2249 +
  3.2250 +   <dt>text-top,
  3.2251 +
  3.2252 +   <dt>text-bottom,
  3.2253 +
  3.2254 +   <dt>&lt;length&gt;,
  3.2255 +
  3.2256 +   <dt>&lt;percentage&gt;
  3.2257 +
  3.2258 +   <dd>These values do not apply to cells; the cell is aligned at the
  3.2259 +    baseline instead.
  3.2260 +  </dl>
  3.2261 +
  3.2262 +  <p>The baseline of a cell is the baseline of the first in-flow <em>line
  3.2263 +   box</em> in the cell, or the first in-flow table-row in the cell,
  3.2264 +   whichever comes first. If there is no such line box or table-row, the
  3.2265 +   baseline is the bottom of content edge of the cell box. For the purposes
  3.2266 +   of finding a baseline, in-flow boxes with a scrolling mechanisms (see the
  3.2267 +   ‘<a href="#overflow"><code class=property>overflow</code></a>’
  3.2268 +   property) must be considered as if scrolled to their origin position. Note
  3.2269 +   that the baseline of a cell may end up below its bottom border, see the <a
  3.2270 +   href="#baseline-below">example</a> below.
  3.2271 +
  3.2272 +  <p>The maximum distance between the top of the cell box and the baseline
  3.2273 +   over all cells that have ‘<code class=css>vertical-align:
  3.2274 +   baseline</code>’ is used to set the <dfn id=baseline-of-the-row.
  3.2275 +   title="baseline of a row">baseline of the row.</dfn> Here is an example:
  3.2276 +
  3.2277 +  <div class=figure>
  3.2278 +   <p><img alt="Example of vertically aligning the   cells"
  3.2279 +    src=cell-align.png>
  3.2280 +
  3.2281 +   <p class=caption>Diagram showing the effect of various values of ‘<a
  3.2282 +    href="#vertical-align"><code class=property>vertical-align</code></a>’
  3.2283 +    on table cells.
  3.2284 +  </div>
  3.2285 +
  3.2286 +  <p>Cell boxes 1 and 2 are aligned at their baselines. Cell box 2 has the
  3.2287 +   largest height above the baseline, so that determines the baseline of the
  3.2288 +   row.
  3.2289 +
  3.2290 +  <p>If a row has no cell box aligned to its baseline, the baseline of that
  3.2291 +   row is the bottom content edge of the lowest cell in the row.
  3.2292 +
  3.2293 +  <p>To avoid ambiguous situations, the alignment of cells proceeds in the
  3.2294 +   following order:
  3.2295 +
  3.2296 +  <ol>
  3.2297 +   <li>First the cells that are aligned on their baseline are positioned.
  3.2298 +    This will establish the baseline of the row. Next the cells with ‘<code
  3.2299 +    class=css>vertical-align: top</code>’ are positioned.
  3.2300 +
  3.2301 +   <li>The row now has a top, possibly a baseline, and a provisional height,
  3.2302 +    which is the distance from the top to the lowest bottom of the cells
  3.2303 +    positioned so far. (See conditions on the cell padding below.)
  3.2304 +
  3.2305 +   <li>If any of the remaining cells, those aligned at the bottom or the
  3.2306 +    middle, have a height that is larger than the current height of the row,
  3.2307 +    the height of the row will be increased to the maximum of those cells, by
  3.2308 +    lowering the bottom.
  3.2309 +
  3.2310 +   <li>Finally the remaining cells are positioned.
  3.2311 +  </ol>
  3.2312 +
  3.2313 +  <p>Cell boxes that are smaller than the height of the row receive extra top
  3.2314 +   or bottom padding.
  3.2315 +
  3.2316 +  <div class=example id=baseline-below>
  3.2317 +   <p>The cell in this example has a baseline below its bottom border:
  3.2318 +
  3.2319 +   <pre>
  3.2320 +div { height: 0; overflow: hidden; }
  3.2321 +
  3.2322 +&lt;table>
  3.2323 + &lt;tr>
  3.2324 +  &lt;td>
  3.2325 +   &lt;div> Test &lt;/div>
  3.2326 +  &lt;/td>
  3.2327 + &lt;/tr>
  3.2328 +&lt;/table>
  3.2329 +</pre>
  3.2330 +  </div>
  3.2331 +
  3.2332 +  <h3 id=column-alignment><span class=secno>7.4. </span>Horizontal alignment
  3.2333 +   in a column</h3>
  3.2334 +
  3.2335 +  <p>The horizontal alignment of a cell's content within a cell box is
  3.2336 +   specified with the ‘<a href="#text-align"><code
  3.2337 +   class=property>text-align</code></a>’ property.
  3.2338 +
  3.2339 +  <p>When the ‘<a href="#text-align"><code
  3.2340 +   class=property>text-align</code></a>’ property for more than one cell in
  3.2341 +   a column is set to a &lt;string&gt; value, the content of those cells is
  3.2342 +   aligned along a vertical axis. The beginning of the string touches this
  3.2343 +   axis. Character directionality determines whether the string lies to the
  3.2344 +   left or right of the axis.
  3.2345 +
  3.2346 +  <p>Aligning text in this way is only useful if the text fits on one line.
  3.2347 +   The result is undefined if the cell content spans more than one line.
  3.2348 +
  3.2349 +  <p>If value of ‘<a href="#text-align"><code
  3.2350 +   class=property>text-align</code></a>’ for a table cell is a string but
  3.2351 +   the string doesn't occur in the cell content, the end of the cell's
  3.2352 +   content touches the vertical axis of alignment.
  3.2353 +
  3.2354 +  <p>Note that the strings do not have to be the same for each cell, although
  3.2355 +   they usually are.
  3.2356 +
  3.2357 +  <p>CSS does not provide a way specify the offset of the vertical alignment
  3.2358 +   axis with respect to the edge of a column box.
  3.2359 +
  3.2360 +  <div class=example>
  3.2361 +   <p>The following style sheet:
  3.2362 +
  3.2363 +   <pre>
  3.2364 +TD { text-align: "." }
  3.2365 +TD:before { content: "$" }
  3.2366 +</pre>
  3.2367 +
  3.2368 +   <p>will cause the column of dollar figures in the following HTML table:
  3.2369 +
  3.2370 +   <pre>
  3.2371 +&lt;TABLE&gt;
  3.2372 +  &lt;COL width="40"&gt;
  3.2373 +  &lt;TR&gt; &lt;TH&gt;Long distance calls
  3.2374 +  &lt;TR&gt; &lt;TD&gt; 1.30
  3.2375 +  &lt;TR&gt; &lt;TD&gt; 2.50
  3.2376 +  &lt;TR&gt; &lt;TD&gt; 10.80
  3.2377 +  &lt;TR&gt; &lt;TD&gt; 111.01
  3.2378 +  &lt;TR&gt; &lt;TD&gt; 85.
  3.2379 +  &lt;TR&gt; &lt;TD&gt; 90
  3.2380 +  &lt;TR&gt; &lt;TD&gt; .05
  3.2381 +  &lt;TR&gt; &lt;TD&gt; .06
  3.2382 +  &lt;/TABLE&gt;
  3.2383 +</pre>
  3.2384 +
  3.2385 +   <p>to align along the decimal point. For fun, we have used the <span
  3.2386 +    class=css>:before</span> pseudo-element to insert a dollar sign before
  3.2387 +    each figure. The table might be rendered as follows:
  3.2388 +
  3.2389 +   <pre>
  3.2390 +Long distance calls
  3.2391 +              $1.30      
  3.2392 +              $2.50
  3.2393 +             $10.80
  3.2394 +            $111.01
  3.2395 +             $85.
  3.2396 +             $90
  3.2397 +               $.05
  3.2398 +               $.06
  3.2399 +</pre>
  3.2400 +  </div>
  3.2401 +  <!-- dynamic effect -->
  3.2402 +
  3.2403 +  <h3 id=dynamic-effects><span class=secno>7.5. </span>Dynamic row and column
  3.2404 +   effects</h3>
  3.2405 +
  3.2406 +  <p>The ‘<a href="#visibility"><code
  3.2407 +   class=property>visibility</code></a>’ property takes the value ‘<code
  3.2408 +   class=css>collapse</code>’ for row, row group, column, and column group
  3.2409 +   elements. This value causes the entire row or column to be removed from
  3.2410 +   the display, and the space normally taken up by the row or column to be
  3.2411 +   made available for other content. Contents of spanned rows and columns
  3.2412 +   that intersect the collapsed column or row are clipped. The suppression of
  3.2413 +   the row or column, however, does not otherwise affect the layout of the
  3.2414 +   table. This allows dynamic effects to remove table rows or columns without
  3.2415 +   forcing a re-layout of the table in order to account for the potential
  3.2416 +   change in column constraints.
  3.2417 +
  3.2418 +  <h2 id=borders><span class=secno>8. </span>Borders</h2>
  3.2419 +
  3.2420 +  <p>There are two distinct models for setting borders on table cells in CSS.
  3.2421 +   One is most suitable for so-called <em>separated borders</em> around
  3.2422 +   individual cells, the other is suitable for borders that are continuous
  3.2423 +   from one end of the table to the other. Many border styles can be achieved
  3.2424 +   with either model, so it is often a matter of taste which one is used.
  3.2425 +
  3.2426 +  <table class=propdef>
  3.2427 +   <tbody>
  3.2428 +    <tr>
  3.2429 +     <td><em>Name:</em>
  3.2430 +
  3.2431 +     <td><dfn id=border-collapse>border-collapse</dfn>
  3.2432 +
  3.2433 +    <tr>
  3.2434 +     <td><em>Value:</em>
  3.2435 +
  3.2436 +     <td>collapse | separate
  3.2437 +
  3.2438 +    <tr>
  3.2439 +     <td><em>Initial:</em>
  3.2440 +
  3.2441 +     <td>collapse
  3.2442 +
  3.2443 +    <tr>
  3.2444 +     <td><em>Applies to:</em>
  3.2445 +
  3.2446 +     <td>‘<a href="#table"><code class=property>table</code></a>’ and
  3.2447 +      ‘<a href="#inline-table"><code
  3.2448 +      class=property>inline-table</code></a>’ elements
  3.2449 +
  3.2450 +    <tr>
  3.2451 +     <td><em>Inherited:</em>
  3.2452 +
  3.2453 +     <td>yes
  3.2454 +
  3.2455 +    <tr>
  3.2456 +     <td><em>Percentages:</em>
  3.2457 +
  3.2458 +     <td>N/A
  3.2459 +
  3.2460 +    <tr>
  3.2461 +     <td><em>Media:</em>
  3.2462 +
  3.2463 +     <td>visual
  3.2464 +
  3.2465 +    <tr>
  3.2466 +     <td><em>Computed value:</em>
  3.2467 +
  3.2468 +     <td>specified value
  3.2469 +  </table>
  3.2470 +
  3.2471 +  <p>This property selects a table's border model. The value ‘<code
  3.2472 +   class=property>separate</code>’ selects the separated borders border
  3.2473 +   model. The value ‘<code class=property>collapse</code>’ selects the
  3.2474 +   collapsing borders model. The models are described below.
  3.2475 +
  3.2476 +  <h3 id=separated-borders><span class=secno>8.1. </span>The separated
  3.2477 +   borders model</h3>
  3.2478 +
  3.2479 +  <table class=propdef>
  3.2480 +   <tbody>
  3.2481 +    <tr>
  3.2482 +     <td><em>Name:</em>
  3.2483 +
  3.2484 +     <td><dfn id=border-spacing>border-spacing</dfn>
  3.2485 +
  3.2486 +    <tr>
  3.2487 +     <td><em>Value:</em>
  3.2488 +
  3.2489 +     <td>&lt;length&gt; &lt;length&gt;?
  3.2490 +
  3.2491 +    <tr>
  3.2492 +     <td><em>Initial:</em>
  3.2493 +
  3.2494 +     <td>0
  3.2495 +
  3.2496 +    <tr>
  3.2497 +     <td><em>Applies to:</em>
  3.2498 +
  3.2499 +     <td>‘<a href="#table"><code class=property>table</code></a>’ and
  3.2500 +      ‘<a href="#inline-table"><code
  3.2501 +      class=property>inline-table</code></a>’ elements*
  3.2502 +
  3.2503 +    <tr>
  3.2504 +     <td><em>Inherited:</em>
  3.2505 +
  3.2506 +     <td>yes
  3.2507 +
  3.2508 +    <tr>
  3.2509 +     <td><em>Percentages:</em>
  3.2510 +
  3.2511 +     <td>N/A
  3.2512 +
  3.2513 +    <tr>
  3.2514 +     <td><em>Media:</em>
  3.2515 +
  3.2516 +     <td>visual
  3.2517 +
  3.2518 +    <tr>
  3.2519 +     <td><em>Computed value:</em>
  3.2520 +
  3.2521 +     <td>specified value
  3.2522 +  </table>
  3.2523 +
  3.2524 +  <p class=note>*) Note: user agents may also apply the border-spacing'
  3.2525 +   property to frameset elements. Which elements are frameset elements is not
  3.2526 +   defined by this specification and is up to the document language. For
  3.2527 +   example, HTML4 defines a &lt;FRAMESET> element, and XHTML 1.0 defines a
  3.2528 +   &lt;frameset> element. The ‘<a href="#border-spacing"><code
  3.2529 +   class=property>border-spacing</code></a>’ property on a frameset element
  3.2530 +   can be thus used as a valid substitute for the nonstandard framespacing
  3.2531 +   attribute.
  3.2532 +
  3.2533 +  <p class=issue>[During the 20 Aug 2001 ftf, we decided to add a property to
  3.2534 +   let the designer choose what background is drawn in border-spacing: the
  3.2535 +   table's background (as in CSS2), half of the cells' background on either
  3.2536 +   side, half of the rows' background on either side, some completely
  3.2537 +   different background...]
  3.2538 +
  3.2539 +  <p>The lengths specify the distance that separates adjoining cell borders.
  3.2540 +   If one length is specified, it gives both the horizontal and vertical
  3.2541 +   spacing. If two are specified, the first gives the horizontal spacing and
  3.2542 +   the second the vertical spacing. Lengths may not be negative.
  3.2543 +
  3.2544 +  <p>The distance between the table border and the borders of the cells on
  3.2545 +   the edge of the table is the table's padding for that side, plus the
  3.2546 +   relevant border spacing distance. For example, on the right hand side, the
  3.2547 +   distance is <var>padding-right</var> + <var>horizontal
  3.2548 +   border-spacing</var>.
  3.2549 +
  3.2550 +  <p>The width of the table is the distance from the left inner padding edge
  3.2551 +   to the right inner padding edge (including the border spacing but
  3.2552 +   excluding padding and border).
  3.2553 +
  3.2554 +  <p>However, in HTML and XHTML1, the width of the &lt;table&gt; element is
  3.2555 +   the distance from the left border edge to the right border edge.
  3.2556 +
  3.2557 +  <p class=issue>Remove the previous paragraph and instead add ‘<code
  3.2558 +   class=property>box-sizing</code>’ to the sample style for HTML.
  3.2559 +
  3.2560 +  <p>In this model, each cell has an individual border. The ‘<a
  3.2561 +   href="#border-spacing"><code class=property>border-spacing</code></a>’
  3.2562 +   property specifies the distance between the borders of adjoining cells. In
  3.2563 +   this space, the row, column, row group, and column group backgrounds are
  3.2564 +   invisible, allowing the table background to show through. Rows, columns,
  3.2565 +   row groups, and column groups cannot have borders (i.e., user agents must
  3.2566 +   ignore the border properties for those elements).
  3.2567 +
  3.2568 +  <div class=example>
  3.2569 +   <p>The table in the figure below could be the result of a style sheet like
  3.2570 +    this:
  3.2571 +
  3.2572 +   <pre>
  3.2573 +table      { border: outset 10pt; 
  3.2574 +             border-collapse: separate;
  3.2575 +             border-spacing: 15pt }
  3.2576 +td         { border: inset 5pt }
  3.2577 +td.special { border: inset 10pt }  /* The top-left cell */
  3.2578 +</pre>
  3.2579 +
  3.2580 +   <div class=figure>
  3.2581 +    <p><img alt="A table with border-spacing" src=tbl-spacing.png>
  3.2582 +
  3.2583 +    <p class=caption>A table with ‘<a href="#border-spacing"><code
  3.2584 +     class=property>border-spacing</code></a>’ set to a length value. Note
  3.2585 +     that each cell has its own border, and the table has a separate border
  3.2586 +     as well.
  3.2587 +   </div>
  3.2588 +  </div>
  3.2589 +
  3.2590 +  <h4 id=empty-cells><span class=secno>8.1.1. </span>Borders around empty
  3.2591 +   cells: the ‘<a href="#empty-cells0"><code
  3.2592 +   class=property>empty-cells</code></a>’ property</h4>
  3.2593 +
  3.2594 +  <table class=propdef>
  3.2595 +   <tbody>
  3.2596 +    <tr>
  3.2597 +     <td><em>Name:</em>
  3.2598 +
  3.2599 +     <td><dfn id=empty-cells0>empty-cells</dfn>
  3.2600 +
  3.2601 +    <tr>
  3.2602 +     <td><em>Value:</em>
  3.2603 +
  3.2604 +     <td>show | hide
  3.2605 +
  3.2606 +    <tr>
  3.2607 +     <td><em>Initial:</em>
  3.2608 +
  3.2609 +     <td>show
  3.2610 +
  3.2611 +    <tr>
  3.2612 +     <td><em>Applies to:</em>
  3.2613 +
  3.2614 +     <td>‘<a href="#table-cell"><code
  3.2615 +      class=property>table-cell</code></a>’ elements
  3.2616 +
  3.2617 +    <tr>
  3.2618 +     <td><em>Inherited:</em>
  3.2619 +
  3.2620 +     <td>yes
  3.2621 +
  3.2622 +    <tr>
  3.2623 +     <td><em>Percentages:</em>
  3.2624 +
  3.2625 +     <td>N/A
  3.2626 +
  3.2627 +    <tr>
  3.2628 +     <td><em>Media:</em>
  3.2629 +
  3.2630 +     <td>visual
  3.2631 +
  3.2632 +    <tr>
  3.2633 +     <td><em>Computed value:</em>
  3.2634 +
  3.2635 +     <td>as specified
  3.2636 +  </table>
  3.2637 +
  3.2638 +  <p>In the separated borders model, this property controls the rendering of
  3.2639 +   borders and backgrounds around cells that have no visible content. Empty
  3.2640 +   cells and cells with the ‘<a href="#visibility"><code
  3.2641 +   class=property>visibility</code></a>’ property set to ‘<a
  3.2642 +   href="#hidden"><code class=property>hidden</code></a>’ are considered to
  3.2643 +   have no visible content. Cells are empty unless they contain one or more
  3.2644 +   of the following:
  3.2645 +
  3.2646 +  <ul>
  3.2647 +   <li>floating content (including empty elements),
  3.2648 +
  3.2649 +   <li>in-flow content (including empty elements) other than whitespace that
  3.2650 +    has been collapsed away by the ‘<code
  3.2651 +    class=property>white-space</code>’ property handling.
  3.2652 +  </ul>
  3.2653 +
  3.2654 +  <p>When this property has the value ‘<code class=property>show</code>’,
  3.2655 +   borders and backgrounds are drawn around/behind empty cells (like normal
  3.2656 +   cells).
  3.2657 +
  3.2658 +  <p>A value of ‘<code class=property>hide</code>’ means that no borders
  3.2659 +   or backgrounds are drawn around/behind empty cells (see point 6 in <a
  3.2660 +   href="#table-layers">“Table layers and transparency”</a>).
  3.2661 +   Furthermore, if all the cells in a row have a value of ‘<code
  3.2662 +   class=property>hide</code>’ and have no visible content, the entire row
  3.2663 +   behaves as if it had ‘<code class=css>display: none</code>’.
  3.2664 +
  3.2665 +  <div class=example>
  3.2666 +   <p>The following rule causes borders and backgrounds to be drawn around
  3.2667 +    all cells:
  3.2668 +
  3.2669 +   <pre>
  3.2670 +table { empty-cells: show }
  3.2671 +</pre>
  3.2672 +  </div>
  3.2673 +
  3.2674 +  <h3 id=collapsing-borders><span class=secno>8.2. </span>The collapsing
  3.2675 +   border model</h3>
  3.2676 +
  3.2677 +  <p>In the collapsing border model, it is possible to specify borders that
  3.2678 +   surround all or part of a cell, row, row group, column, and column group.
  3.2679 +   Borders for HTML's "rule" attribute can be specified this way.
  3.2680 +
  3.2681 +  <p>Borders are centered on the grid lines between the cells. User agents
  3.2682 +   must find a consistent rule for rounding off in the case of an odd number
  3.2683 +   of discrete units (screen pixels, printer dots).
  3.2684 +
  3.2685 +  <p>The diagram below shows how the width of the table, the widths of the
  3.2686 +   borders, the padding, and the cell width interact. Their relation is given
  3.2687 +   by the following equation, which holds for every row of the table:
  3.2688 +
  3.2689 +  <blockquote>
  3.2690 +   <p><var>row-width</var> = (0.5 * <a
  3.2691 +    href="#border-width"><var>border-width</var></a><sub>0</sub>) +
  3.2692 +    <var>padding-left</var><sub>1</sub> + <a
  3.2693 +    href="#width"><var>width</var></a><sub>1</sub> +
  3.2694 +    <var>padding-right</var><sub>1</sub> + <a
  3.2695 +    href="#border-width"><var>border-width</var></a><sub>1</sub> +
  3.2696 +    <var>padding-left</var><sub>2</sub> +...+
  3.2697 +    <var>padding-right</var><sub><var>n</var></sub> + (0.5 * <a
  3.2698 +    href="#border-width"><var>border-width</var></a><sub><var>n</var></sub>)
  3.2699 +  </blockquote>
  3.2700 +
  3.2701 +  <p>Here <var>n</var> is the number of cells in the row,
  3.2702 +   <var>padding-left</var><sub><var>i</var></sub> and
  3.2703 +   <var>padding-right</var><sub><var>i</var></sub> refer to the left (resp.,
  3.2704 +   right) padding of cell <var>i</var>, and <a
  3.2705 +   href="#border-width"><var>border-width</var></a><sub><var>i</var></sub>
  3.2706 +   refers to the border between cells <var>i</var> and <var>i</var> + 1.
  3.2707 +
  3.2708 +  <p>UAs must compute an initial left and right border width for the table by
  3.2709 +   examining the first and last cells in the first row of the table. The left
  3.2710 +   border width of the table is half of the first cell's collapsed left
  3.2711 +   border, and the right border width of the table is half of the last cell's
  3.2712 +   collapsed right border. If subsequent rows have larger collapsed left and
  3.2713 +   right borders, then any excess spills into the margin area of the table.
  3.2714 +
  3.2715 +  <p>The top border width of the table is computed by examining all cells who
  3.2716 +   collapse their top borders with the top border of the table. The top
  3.2717 +   border width of the table is equal to half of the maximum collapsed top
  3.2718 +   border. The bottom border width is computed by examining all cells whose
  3.2719 +   bottom borders collapse with the bottom of the table. The bottom border
  3.2720 +   width is equal to half of the maximum collapsed bottom border.
  3.2721 +
  3.2722 +  <p>Any borders that spill into the margin are taken into account when
  3.2723 +   determining if the table overflows some ancestor (see <a
  3.2724 +   class=propinst-overflow href="#overflow">‘<code
  3.2725 +   class=property>overflow</code>’</a>).
  3.2726 +
  3.2727 +  <div class=figure>
  3.2728 +   <p><img
  3.2729 +    alt="Schema showing the widths of cells   and borders and the padding of cells"
  3.2730 +    src=tbl-width.png>
  3.2731 +
  3.2732 +   <p class=caption>Schema showing the widths of cells and borders and the
  3.2733 +    padding of cells.
  3.2734 +  </div>
  3.2735 +
  3.2736 +  <p>Note that in this model, the width of the table includes half the table
  3.2737 +   border. Also, in this model, a table doesn't have padding (but does have
  3.2738 +   margins).
  3.2739 +
  3.2740 +  <p>CSS3 does not define where the edge of a background on a table element
  3.2741 +   lies.
  3.2742 +
  3.2743 +  <h4 id=border-conflict-resolution><span class=secno>8.2.1. </span>Border
  3.2744 +   conflict resolution</h4>
  3.2745 +
  3.2746 +  <p>In the collapsing border model, borders at every edge of every cell may
  3.2747 +   be specified by border properties on a variety of elements that meet at
  3.2748 +   that edge (cells, rows, row groups, columns, column groups, and the table
  3.2749 +   itself), and these borders may vary in width, style, and color. The rule
  3.2750 +   of thumb is that at each edge the most "eye catching" border style is
  3.2751 +   chosen, except that any occurrence of the style ‘<a href="#hidden"><code
  3.2752 +   class=property>hidden</code></a>’ unconditionally turns the border off.
  3.2753 +
  3.2754 +  <p>The following rules determine which border style “wins”in case of a
  3.2755 +   conflict:
  3.2756 +
  3.2757 +  <ol>
  3.2758 +   <li>Borders with the ‘<a href="#border-style"><code
  3.2759 +    class=property>border-style</code></a>’ of ‘<a href="#hidden"><code
  3.2760 +    class=css>hidden</code></a>’ take precedence over all other conflicting
  3.2761 +    borders. Any border with this value suppresses all borders at this
  3.2762 +    location.
  3.2763 +
  3.2764 +   <li>Borders with a style of ‘<a href="#none"><code
  3.2765 +    class=css>none</code></a>’ have the lowest priority. Only if the border
  3.2766 +    properties of all the elements meeting at this edge are ‘<a
  3.2767 +    href="#none"><code class=css>none</code></a>’ will the border be
  3.2768 +    omitted (but note that ‘<a href="#none"><code
  3.2769 +    class=css>none</code></a>’ is the default value for the border style.)
  3.2770 +
  3.2771 +   <li>If none of the styles are ‘<a href="#hidden"><code
  3.2772 +    class=css>hidden</code></a>’ and at least one of them is not ‘<a
  3.2773 +    href="#none"><code class=css>none</code></a>’, then narrow borders are
  3.2774 +    discarded in favor of wider ones. If several have the same ‘<a
  3.2775 +    href="#border-width"><code class=property>border-width</code></a>’ then
  3.2776 +    styles are preferred in this order: ‘<a href="#double"><code
  3.2777 +    class=css>double</code></a>’, ‘<a href="#solid"><code
  3.2778 +    class=css>solid</code></a>’, ‘<a href="#dashed"><code
  3.2779 +    class=css>dashed</code></a>’, ‘<a href="#dotted"><code
  3.2780 +    class=css>dotted</code></a>’, ‘<a href="#ridge"><code
  3.2781 +    class=css>ridge</code></a>’, ‘<a href="#outset"><code
  3.2782 +    class=css>outset</code></a>’, ‘<a href="#groove"><code
  3.2783 +    class=css>groove</code></a>’, and the lowest: ‘<a href="#inset"><code
  3.2784 +    class=css>inset</code></a>’.
  3.2785 +
  3.2786 +   <li>If border styles differ only in color, then a style set on a cell wins
  3.2787 +    over one on a row, which wins over a row group, column, column group and,
  3.2788 +    lastly, table. When two elements of the same type conflict, then the one
  3.2789 +    further to the left (if the table's ‘<a href="#direction"><code
  3.2790 +    class=property>direction</code></a>’ is ‘<code
  3.2791 +    class=css>ltr</code>’; right, if it is ‘<code
  3.2792 +    class=css>rtl</code>’) and further to the top wins.
  3.2793 +  </ol>
  3.2794 +
  3.2795 +  <div class=example>
  3.2796 +   <p>The following example illustrates the application of these precedence
  3.2797 +    rules. This style sheet:
  3.2798 +
  3.2799 +   <pre>
  3.2800 +table          { border-collapse: collapse;
  3.2801 +                 border: 5px solid yellow; }
  3.2802 +*#col1         { border: 3px solid black; }
  3.2803 +td             { border: 1px solid red; padding: 1em; }
  3.2804 +td.cell5       { border: 5px dashed blue; }
  3.2805 +td.cell6       { border: 5px solid green; }
  3.2806 +</pre>
  3.2807 +
  3.2808 +   <p>with this HTML source:
  3.2809 +
  3.2810 +   <pre>
  3.2811 +&lt;TABLE&gt;
  3.2812 +&lt;COL id=&quot;col1&quot;&gt;&lt;COL id=&quot;col2&quot;&gt;&lt;COL id=&quot;col3&quot;&gt;
  3.2813 +&lt;TR id=&quot;row1&quot;&gt;
  3.2814 +    &lt;TD&gt; 1
  3.2815 +    &lt;TD&gt; 2
  3.2816 +    &lt;TD&gt; 3
  3.2817 +&lt;/TR&gt;
  3.2818 +&lt;TR id=&quot;row2&quot;&gt;
  3.2819 +    &lt;TD&gt; 4 
  3.2820 +    &lt;TD class="cell5"&gt; 5
  3.2821 +    &lt;TD class="cell6"&gt; 6
  3.2822 +&lt;/TR&gt;
  3.2823 +&lt;TR id=&quot;row3&quot;&gt;
  3.2824 +    &lt;TD&gt; 7
  3.2825 +    &lt;TD&gt; 8
  3.2826 +    &lt;TD&gt; 9
  3.2827 +&lt;/TR&gt;
  3.2828 +&lt;TR id=&quot;row4&quot;&gt;
  3.2829 +    &lt;TD&gt; 10
  3.2830 +    &lt;TD&gt; 11
  3.2831 +    &lt;TD&gt; 12
  3.2832 +&lt;/TR&gt;
  3.2833 +&lt;TR id=&quot;row5&quot;&gt;
  3.2834 +    &lt;TD&gt; 13
  3.2835 +    &lt;TD&gt; 14
  3.2836 +    &lt;TD&gt; 15
  3.2837 +&lt;/TR&gt;
  3.2838 +&lt;/TABLE&gt;
  3.2839 +</pre>
  3.2840 +
  3.2841 +   <p>would produce something like this:
  3.2842 +
  3.2843 +   <div class=figure>
  3.2844 +    <p><img alt="An example of a table   with collapsed borders"
  3.2845 +     src=tbl-border-conflict.png>
  3.2846 +
  3.2847 +    <p class=caption>An example of a table with collapsed borders.
  3.2848 +   </div>
  3.2849 +  </div>
  3.2850 +
  3.2851 +  <div class=example>
  3.2852 +   <p>Here is an example of hidden collapsing borders:
  3.2853 +
  3.2854 +   <div class=figure>
  3.2855 +    <p><img alt="Table with two omitted borders" src=CSStbl3.png>
  3.2856 +
  3.2857 +    <p class=caption> Table with two omitted internal borders.
  3.2858 +   </div>
  3.2859 +
  3.2860 +   <p>HTML source:
  3.2861 +
  3.2862 +   <pre class=html-example>
  3.2863 +&lt;TABLE style="border-collapse: collapse; border: solid;"&gt;
  3.2864 +&lt;TR&gt;&lt;TD style="border-right: hidden; border-bottom: hidden"&gt;foo&lt;/TD&gt;
  3.2865 +    &lt;TD style="border: solid"&gt;bar&lt;/TD&gt;&lt;/TR&gt;
  3.2866 +&lt;TR&gt;&lt;TD style="border: none"&gt;foo&lt;/TD&gt;
  3.2867 +    &lt;TD style="border: solid"&gt;bar&lt;/TD&gt;&lt;/TR&gt;
  3.2868 +&lt;/TABLE&gt;
  3.2869 +</pre>
  3.2870 +  </div>
  3.2871 +
  3.2872 +  <h4 id=collapsed-bg><span class=secno>8.2.2. </span>Backgrounds in the
  3.2873 +   collapsed border model</h4>
  3.2874 +  <!--
  3.2875 +<p>CSS3 does not define where the edge of a background on a table
  3.2876 +element lies. <span class=issue>It still doesn't?</span>
  3.2877 +-->
  3.2878 +
  3.2879 +  <p>Backgrounds of cells, rows, columns, etc., are drawn inside the grid
  3.2880 +   lines that enclose that cell, row, etc. I.e., if there is a border, the
  3.2881 +   background starts in the middle of the border. The adjoining cell draws
  3.2882 +   the background of the other half of the border.
  3.2883 +
  3.2884 +  <p>The exception are the outer edges of the table. Here the background
  3.2885 +   doesn't start in the middle of the border, but starts a little further
  3.2886 +   outside. How far outside is determined by the <a class=property
  3.2887 +   href="#border-width">border-width</a> property of the table element: the
  3.2888 +   background starts half the value of border-width outside the grid.
  3.2889 +
  3.2890 +  <p class=note>Note that this means that, if the cells, rows, etc., don't
  3.2891 +   specify any borders that collapse with the table's border, the background
  3.2892 +   will be drawn under the whole border, from border edge to border edge,
  3.2893 +   exactly as for non-table elements.
  3.2894 +
  3.2895 +  <div class=example>
  3.2896 +   <p>Here is a table with three rows and a yellow background. The table
  3.2897 +    element has a 0.5em border, but the first cell has a 1em border, which
  3.2898 +    will therefore not be fully covered by the table's background:
  3.2899 +
  3.2900 +   <pre>
  3.2901 +&lt;table style="background: yellow; border: 0.5em dotted"&gt;
  3.2902 +  &lt;tr&gt;
  3.2903 +    &lt;td style="border: 1em dotted"&gt;... &lt;/td&gt;
  3.2904 +  &lt;/tr&gt;
  3.2905 +  &lt;tr&gt;
  3.2906 +    &lt;td&gt;... &lt;/td&gt;
  3.2907 +  &lt;/tr&gt;
  3.2908 +  &lt;tr&gt;
  3.2909 +    &lt;td&gt;... &lt;/td&gt;
  3.2910 +  &lt;/tr&gt;
  3.2911 +&lt;/table&gt;
  3.2912 +</pre>
  3.2913 +
  3.2914 +   <div class=figure>
  3.2915 +    <p><img
  3.2916 +     alt="The background covers the small dots, but   not the big ones"
  3.2917 +     src=bg.png>
  3.2918 +
  3.2919 +    <p class=caption>The background extends to the width given by the
  3.2920 +     border-width property of the table element. The border-width of the
  3.2921 +     first row is larger and thus the border extends outside the background.
  3.2922 +   </div>
  3.2923 +  </div>
  3.2924 +
  3.2925 +  <h3 id=border-styles><span class=secno>8.3. </span>Border styles</h3>
  3.2926 +
  3.2927 +  <p>Some of the values of the ‘<a href="#border-style"><code
  3.2928 +   class=property>border-style</code></a>’ have different meanings in
  3.2929 +   tables than for other elements. In the list below they are marked with an
  3.2930 +   asterisk.
  3.2931 +
  3.2932 +  <dl>
  3.2933 +   <dt><dfn id=none>none</dfn>
  3.2934 +
  3.2935 +   <dd>No border.
  3.2936 +
  3.2937 +   <dt>*<dfn id=hidden>hidden</dfn>
  3.2938 +
  3.2939 +   <dd>Same as ‘<a href="#none"><code class=property>none</code></a>’,
  3.2940 +    but in the <a href="#collapsing-borders">collapsing border model</a>,
  3.2941 +    also inhibits any other border (see the section on <a
  3.2942 +    href="#border-conflict-resolution">border conflicts</a>).
  3.2943 +
  3.2944 +   <dt><dfn id=dotted>dotted</dfn>
  3.2945 +
  3.2946 +   <dd>The border is a series of dots.
  3.2947 +
  3.2948 +   <dt><dfn id=dashed>dashed</dfn>
  3.2949 +
  3.2950 +   <dd>The border is a series of short line segments.
  3.2951 +
  3.2952 +   <dt><dfn id=solid>solid</dfn>
  3.2953 +
  3.2954 +   <dd>The border is a single line segment.
  3.2955 +
  3.2956 +   <dt><dfn id=double>double</dfn>
  3.2957 +
  3.2958 +   <dd>The border is two solid lines. The sum of the two lines and the space
  3.2959 +    between them equals the value of ‘<a href="#border-width"><code
  3.2960 +    class=property>border-width</code></a>’.
  3.2961 +
  3.2962 +   <dt><dfn id=groove>groove</dfn>
  3.2963 +
  3.2964 +   <dd>The border looks as though it were carved into the canvas.
  3.2965 +
  3.2966 +   <dt><dfn id=ridge>ridge</dfn>
  3.2967 +
  3.2968 +   <dd>The opposite of ‘<a href="#groove"><code
  3.2969 +    class=css>groove</code></a>’: the border looks as though it were coming
  3.2970 +    out of the canvas.
  3.2971 +
  3.2972 +   <dt>*<dfn id=inset>inset</dfn>
  3.2973 +
  3.2974 +   <dd>In the <a href="#separated-borders">separated borders model</a>, the
  3.2975 +    border makes the entire box look as though it were embedded in the
  3.2976 +    canvas. In the <a href="#collapsing-borders">collapsing border model</a>,
  3.2977 +    same as ‘<a href="#ridge"><code class=property>ridge</code></a>’.
  3.2978 +
  3.2979 +   <dt>*<dfn id=outset>outset</dfn>
  3.2980 +
  3.2981 +   <dd>In the <a href="#separated-borders">separated borders model</a>, the
  3.2982 +    border makes the entire box look as though it were coming out of the
  3.2983 +    canvas. In the <a href="#collapsing-borders">collapsing border model</a>,
  3.2984 +    same as ‘<a href="#groove"><code class=property>groove</code></a>’.
  3.2985 +  </dl>
  3.2986 +
  3.2987 +  <h2 id=the-table-column-span-and-table-row-span><span class=secno>9.
  3.2988 +   </span>The ‘<a href="#table-column-span"><code
  3.2989 +   class=property>table-column-span</code></a>’ and ‘<a
  3.2990 +   href="#table-row-span"><code class=property>table-row-span</code></a>’
  3.2991 +   properties</h2>
  3.2992 +
  3.2993 +  <table class=propdef>
  3.2994 +   <tbody>
  3.2995 +    <tr>
  3.2996 +     <td><em>Name:</em>
  3.2997 +
  3.2998 +     <td><dfn id=table-column-span>table-column-span</dfn>, <dfn
  3.2999 +      id=table-row-span>table-row-span</dfn>
  3.3000 +
  3.3001 +    <tr>
  3.3002 +     <td><em>Value:</em>
  3.3003 +
  3.3004 +     <td>auto | attr(...)
  3.3005 +
  3.3006 +    <tr>
  3.3007 +     <td><em>Initial:</em>
  3.3008 +
  3.3009 +     <td>auto
  3.3010 +
  3.3011 +    <tr>
  3.3012 +     <td><em>Applies to:</em>
  3.3013 +
  3.3014 +     <td>table cells
  3.3015 +
  3.3016 +    <tr>
  3.3017 +     <td><em>Inherited:</em>
  3.3018 +
  3.3019 +     <td>no
  3.3020 +
  3.3021 +    <tr>
  3.3022 +     <td><em>Percentages:</em>
  3.3023 +
  3.3024 +     <td>N/A
  3.3025 +
  3.3026 +    <tr>
  3.3027 +     <td><em>Media:</em>
  3.3028 +
  3.3029 +     <td>visual
  3.3030 +
  3.3031 +    <tr>
  3.3032 +     <td><em>Computed value:</em>
  3.3033 +
  3.3034 +     <td>specified value
  3.3035 +  </table>
  3.3036 +
  3.3037 +  <p>The properties ‘<a href="#table-column-span"><code
  3.3038 +   class=property>table-column-span</code></a>’ and ‘<a
  3.3039 +   href="#table-row-span"><code class=property>table-row-span</code></a>’
  3.3040 +   specify which attributes in the source document contain the number of
  3.3041 +   columns, resp. rows that the element spans. See <a
  3.3042 +   href="#Visual">“visual layout of table contents.”</a> It only affects
  3.3043 +   elements that are rendered as table cells (<span class=css>‘<code
  3.3044 +   class=css>display: table-cell</code>’</span>).
  3.3045 +
  3.3046 +  <p>A value of ‘<code class=css>attr(<var>X</var>)</code>’ means that
  3.3047 +   the attribute <var>X</var> of the current element must be parsed as a
  3.3048 +   number. If there is no attribute <var>X</var> or it does not contain a
  3.3049 +   number, the effect is as if the number were a "1".
  3.3050 +
  3.3051 +  <p>The UA must ignore leading and trailing whitespace in the attribute
  3.3052 +   <var>X</var> and accept <span class=issue>only (or at least?)</span>
  3.3053 +   decimal integers. Numbers less than 1 are interpreted as "1". <span
  3.3054 +   class=issue>[Specify what we mean by "decimal integer"? Leading zeros?
  3.3055 +   Ignore trailing garbage, as in "2rows" -&gt; "2"? Special rules for "0" or
  3.3056 +   "*" to span as many rows/columns as possible?]</span>
  3.3057 +
  3.3058 +  <p>A value of ‘<code class=css>auto</code>’ means that the UA should
  3.3059 +   apply its built-in knowledge of the document format to determine the
  3.3060 +   number of rows/columns to span, or assume "1" if it has no such knowledge.
  3.3061 +
  3.3062 +  <p class=issue>[Relaxed conformance requirements for HTML?]
  3.3063 +
  3.3064 +  <div class=example>
  3.3065 +   <p>The following rules might be found in a UA style sheet for HTML or
  3.3066 +    XHTML:
  3.3067 +
  3.3068 +   <pre>
  3.3069 +td, th {
  3.3070 +  table-column-span: attr(colspan);
  3.3071 +  table-row-span: attr(rowspan) }
  3.3072 +</pre>
  3.3073 +  </div>
  3.3074 +
  3.3075 +  <p>The specified value is the computed value, i.e., ‘<code
  3.3076 +   class=css>attr(<var>X</var>)</code>’ is <em>not</em> replaced by the
  3.3077 +   value of <var>X</var>.
  3.3078 +
  3.3079 +  <p class=issue>In this proposal, ‘<code class=property>col-span</code>’
  3.3080 +   and ‘<code class=property>row-span</code>’ do not accept explicit
  3.3081 +   numbers (&lt;<em>integer&gt;</em>), on the grounds that a table in the
  3.3082 +   source is (at least in the ideal case) a structural element and the spans
  3.3083 +   in it make structural sense. Therefore the spans can be used by CSS, but
  3.3084 +   not changed. On the other hand, if you use CSS to display something as a
  3.3085 +   table for visual purposes (e.g., to display a DL element as a 2-column
  3.3086 +   table), it makes sense to allow certain elements to span columns or rows
  3.3087 +   (e.g., a title across the top of the DL list).
  3.3088 +
  3.3089 +  <h2 id=aligning-tables-table-baseline-property><span class=secno>10.
  3.3090 +   </span>Aligning tables: ‘<a href="#table-baseline"><code
  3.3091 +   class=property>table-baseline</code></a>’ property</h2>
  3.3092 +  <!-- See CSS ftf 9-11 Oct 2006 -->
  3.3093 +
  3.3094 +  <p class=issue>This property was decided during the CSS meeting of 9–11
  3.3095 +   October 2006 in Mountain View on the request of George Chavchanidze. It
  3.3096 +   can help align matrices and other table-like constructs in mathematics to
  3.3097 +   the surrounding text.
  3.3098 +
  3.3099 +  <table class=propdef>
  3.3100 +   <tbody>
  3.3101 +    <tr>
  3.3102 +     <td><em>Name:</em>
  3.3103 +
  3.3104 +     <td><dfn id=table-baseline>table-baseline</dfn>
  3.3105 +
  3.3106 +    <tr>
  3.3107 +     <td><em>Value:</em>
  3.3108 +
  3.3109 +     <td><var>&lt;integer&gt;</var>
  3.3110 +
  3.3111 +    <tr>
  3.3112 +     <td><em>Initial:</em>
  3.3113 +
  3.3114 +     <td>1
  3.3115 +
  3.3116 +    <tr>
  3.3117 +     <td><em>Applies to:</em>
  3.3118 +
  3.3119 +     <td>tables and inline-tables
  3.3120 +
  3.3121 +    <tr>
  3.3122 +     <td><em>Inherited:</em>
  3.3123 +
  3.3124 +     <td>no
  3.3125 +
  3.3126 +    <tr>
  3.3127 +     <td><em>Percentages:</em>
  3.3128 +
  3.3129 +     <td>N/A
  3.3130 +
  3.3131 +    <tr>
  3.3132 +     <td><em>Media:</em>
  3.3133 +
  3.3134 +     <td>visual
  3.3135 +
  3.3136 +    <tr>
  3.3137 +     <td><em>Computed value:</em>
  3.3138 +
  3.3139 +     <td>specified value
  3.3140 +  </table>
  3.3141 +
  3.3142 +  <p>The property sets the baselines of the table for use by ‘<a
  3.3143 +   href="#vertical-align"><code class=property>vertical-align</code></a>’:
  3.3144 +   If the value is <var>N</var>, the <dfn id=baselines-of-the-table
  3.3145 +   title="baseline of a table">baselines of the table</dfn> are the <a
  3.3146 +   href="#baseline-of-the-row."><em title="baseline of a row">baselines of
  3.3147 +   the <var>N</var>th row.</em></a> If <var>N</var> is less than 1, use the
  3.3148 +   first row; if <var>N</var> is greater than the number of rows, use the
  3.3149 +   last row.
  3.3150 +
  3.3151 +  <p>However, if ‘<a href="#vertical-align"><code
  3.3152 +   class=property>vertical-align</code></a>’ is ‘<a href="#top0"><code
  3.3153 +   class=css>top</code></a>’ or ‘<a href="#bottom0"><code
  3.3154 +   class=css>bottom</code></a>’, the alignment is with respect to the top
  3.3155 +   or bottom border edge of the table, not the row.
  3.3156 +
  3.3157 +  <p class=note>Note that both inline (‘<a href="#inline-table"><code
  3.3158 +   class=css>inline-table</code></a>’) and displayed (‘<a
  3.3159 +   href="#table"><code class=css>table</code></a>’) tables have a baseline.
  3.3160 +   The latter is used, e.g., when a table is nested in another table's cell
  3.3161 +   and has to be aligned to other cells in the same row.
  3.3162 +
  3.3163 +  <div class=example>
  3.3164 +   <p>The following example shows a 3×3 table that is aligned on the
  3.3165 +    baseline of the middle row:
  3.3166 +
  3.3167 +   <pre>
  3.3168 +&lt;p
  3.3169 +</pre>
  3.3170 +  </div>
  3.3171 +
  3.3172 +  <h2 id=audio-rendering-of-tables><span class=secno>11. </span>Audio
  3.3173 +   rendering of tables</h2>
  3.3174 +
  3.3175 +  <p class=issue>Move this section to Speech module?
  3.3176 +
  3.3177 +  <p>When a table is spoken by a speech generator, the relation between the
  3.3178 +   data cells and the header cells must be expressed in a different way than
  3.3179 +   by horizontal and vertical alignment. Some speech browsers may allow a
  3.3180 +   user to move around in the 2-dimensional space, thus giving them the
  3.3181 +   opportunity to map out the spatially represented relations. When that is
  3.3182 +   not possible, the style sheet must specify at which points the headers are
  3.3183 +   spoken.
  3.3184 +
  3.3185 +  <h3 id=speak-headers><span class=secno>11.1. </span>Speaking headers: the
  3.3186 +   ‘<a href="#speak-header"><code class=property>speak-header</code></a>’
  3.3187 +   property</h3>
  3.3188 +
  3.3189 +  <table class=propdef>
  3.3190 +   <tbody>
  3.3191 +    <tr>
  3.3192 +     <td><em>Name:</em>
  3.3193 +
  3.3194 +     <td><dfn id=speak-header>speak-header</dfn>
  3.3195 +
  3.3196 +    <tr>
  3.3197 +     <td><em>Value:</em>
  3.3198 +
  3.3199 +     <td>once | always
  3.3200 +
  3.3201 +    <tr>
  3.3202 +     <td><em>Initial:</em>
  3.3203 +
  3.3204 +     <td>once
  3.3205 +
  3.3206 +    <tr>
  3.3207 +     <td><em>Applies to:</em>
  3.3208 +
  3.3209 +     <td>elements that have table header information
  3.3210 +
  3.3211 +    <tr>
  3.3212 +     <td><em>Inherited:</em>
  3.3213 +
  3.3214 +     <td>yes
  3.3215 +
  3.3216 +    <tr>
  3.3217 +     <td><em>Percentages:</em>
  3.3218 +
  3.3219 +     <td>N/A
  3.3220 +
  3.3221 +    <tr>
  3.3222 +     <td><em>Media:</em>
  3.3223 +
  3.3224 +     <td>aural
  3.3225 +
  3.3226 +    <tr>
  3.3227 +     <td><em>Computed value:</em>
  3.3228 +
  3.3229 +     <td>specified value
  3.3230 +  </table>
  3.3231 +
  3.3232 +  <p>This property specifies whether table headers are spoken before every
  3.3233 +   cell, or only before a cell when that cell is associated with a different
  3.3234 +   header than the previous cell. Values have the following meanings:
  3.3235 +
  3.3236 +  <dl>
  3.3237 +   <dt>once
  3.3238 +
  3.3239 +   <dd>The header is spoken one time, before a series of cells.
  3.3240 +
  3.3241 +   <dt>always
  3.3242 +
  3.3243 +   <dd>The header is spoken before every pertinent cell.
  3.3244 +  </dl>
  3.3245 +
  3.3246 +  <p>Each document language may have different mechanisms that allow authors
  3.3247 +   to specify headers. For example, in HTML 4 (<a href="#HTML40"
  3.3248 +   rel=biblioentry>[HTML40]<!--{{HTML40}}--></a>), it is possible to specify
  3.3249 +   header information with three different attributes ("headers", "scope",
  3.3250 +   and "axis"), and the specification gives an algorithm for determining
  3.3251 +   header information when these attributes have not been specified.
  3.3252 +
  3.3253 +  <div class=html-example>
  3.3254 +   <div class=figure>
  3.3255 +    <p><img alt="Image of a table created in MS Word" src=table1.png>
  3.3256 +
  3.3257 +    <p class=caption>Image of a table with header cells ("San Jose" and
  3.3258 +     "Seattle") that are not in the same column or row as the data they apply
  3.3259 +     to.
  3.3260 +   </div>
  3.3261 +
  3.3262 +   <p>This HTML example presents the money spent on meals, hotels and
  3.3263 +    transport in two locations (San Jose and Seattle) for successive days.
  3.3264 +    Conceptually, you can think of the table in terms of an n-dimensional
  3.3265 +    space. The headers of this space are: location, day, category and
  3.3266 +    sub-total. Some cells define marks along an axis while others give money
  3.3267 +    spent at points within this space. The mark-up for this table is:
  3.3268 +
  3.3269 +   <pre>
  3.3270 +&lt;TABLE&gt;
  3.3271 +&lt;CAPTION&gt;Travel Expense Report&lt;/CAPTION&gt;
  3.3272 +&lt;TR&gt;
  3.3273 +  &lt;TH&gt;&lt;/TH&gt;
  3.3274 +  &lt;TH&gt;Meals&lt;/TH&gt;
  3.3275 +  &lt;TH&gt;Hotels&lt;/TH&gt;
  3.3276 +  &lt;TH&gt;Transport&lt;/TH&gt;
  3.3277 +  &lt;TH&gt;sub-total&lt;/TH&gt;
  3.3278 +&lt;/TR&gt;
  3.3279 +&lt;TR&gt;
  3.3280 +  &lt;TH id="san-jose" axis="san-jose"&gt;San Jose&lt;/TH&gt;
  3.3281 +&lt;/TR&gt;
  3.3282 +&lt;TR&gt;
  3.3283 +  &lt;TH headers="san-jose"&gt;25-Aug-97&lt;/TH&gt;
  3.3284 +  &lt;TD&gt;37.74&lt;/TD&gt;
  3.3285 +  &lt;TD&gt;112.00&lt;/TD&gt;
  3.3286 +  &lt;TD&gt;45.00&lt;/TD&gt;
  3.3287 +  &lt;TD&gt;&lt;/TD&gt;
  3.3288 +&lt;/TR&gt;
  3.3289 +&lt;TR&gt;
  3.3290 +  &lt;TH headers="san-jose"&gt;26-Aug-97&lt;/TH&gt;
  3.3291 +  &lt;TD&gt;27.28&lt;/TD&gt;
  3.3292 +  &lt;TD&gt;112.00&lt;/TD&gt;
  3.3293 +  &lt;TD&gt;45.00&lt;/TD&gt;
  3.3294 +  &lt;TD&gt;&lt;/TD&gt;
  3.3295 +&lt;/TR&gt;
  3.3296 +&lt;TR&gt;
  3.3297 +  &lt;TH headers="san-jose"&gt;sub-total&lt;/TH&gt;
  3.3298 +  &lt;TD&gt;65.02&lt;/TD&gt;
  3.3299 +  &lt;TD&gt;224.00&lt;/TD&gt;
  3.3300 +  &lt;TD&gt;90.00&lt;/TD&gt;
  3.3301 +  &lt;TD&gt;379.02&lt;/TD&gt;
  3.3302 +&lt;/TR&gt;
  3.3303 +&lt;TR&gt;
  3.3304 +  &lt;TH id="seattle" axis="seattle"&gt;Seattle&lt;/TH&gt;
  3.3305 +&lt;/TR&gt;
  3.3306 +&lt;TR&gt;
  3.3307 +  &lt;TH headers="seattle"&gt;27-Aug-97&lt;/TH&gt;
  3.3308 +  &lt;TD&gt;96.25&lt;/TD&gt;
  3.3309 +  &lt;TD&gt;109.00&lt;/TD&gt;
  3.3310 +  &lt;TD&gt;36.00&lt;/TD&gt;
  3.3311 +  &lt;TD&gt;&lt;/TD&gt;
  3.3312 +&lt;/TR&gt;
  3.3313 +&lt;TR&gt;
  3.3314 +  &lt;TH headers="seattle"&gt;28-Aug-97&lt;/TH&gt;
  3.3315 +  &lt;TD&gt;35.00&lt;/TD&gt;
  3.3316 +  &lt;TD&gt;109.00&lt;/TD&gt;
  3.3317 +  &lt;TD&gt;36.00&lt;/TD&gt;
  3.3318 +  &lt;TD&gt;&lt;/TD&gt;
  3.3319 +&lt;/TR&gt;
  3.3320 +&lt;TR&gt;
  3.3321 +  &lt;TH headers="seattle"&gt;sub-total&lt;/TH&gt;
  3.3322 +  &lt;TD&gt;131.25&lt;/TD&gt;
  3.3323 +  &lt;TD&gt;218.00&lt;/TD&gt;
  3.3324 +  &lt;TD&gt;72.00&lt;/TD&gt;
  3.3325 +  &lt;TD&gt;421.25&lt;/TD&gt;
  3.3326 +&lt;/TR&gt;
  3.3327 +&lt;TR&gt;
  3.3328 +  &lt;TH&gt;Totals&lt;/TH&gt;
  3.3329 +  &lt;TD&gt;196.27&lt;/TD&gt;
  3.3330 +  &lt;TD&gt;442.00&lt;/TD&gt;
  3.3331 +  &lt;TD&gt;162.00&lt;/TD&gt;
  3.3332 +  &lt;TD&gt;800.27&lt;/TD&gt;
  3.3333 +&lt;/TR&gt;
  3.3334 +&lt;/TABLE&gt;
  3.3335 +</pre>
  3.3336 +
  3.3337 +   <p>By providing the data model in this way, authors make it possible for
  3.3338 +    speech enabled-browsers to explore the table in rich ways, e.g., each
  3.3339 +    cell could be spoken as a list, repeating the applicable headers before
  3.3340 +    each data cell:
  3.3341 +
  3.3342 +   <pre>
  3.3343 +San Jose, 25-Aug-97, Meals:  37.74
  3.3344 +San Jose, 25-Aug-97, Hotels:  112.00
  3.3345 +San Jose, 25-Aug-97, Transport:  45.00
  3.3346 +...
  3.3347 +</pre>
  3.3348 +
  3.3349 +   <p>The browser could also speak the headers only when they change:
  3.3350 +
  3.3351 +   <pre>
  3.3352 +San Jose, 25-Aug-97, Meals: 37.74
  3.3353 +    Hotels: 112.00
  3.3354 +    Transport: 45.00
  3.3355 +  26-Aug-97, Meals: 27.28
  3.3356 +    Hotels: 112.00
  3.3357 +...
  3.3358 +</pre>
  3.3359 +  </div>
  3.3360 +
  3.3361 +  <h2 class=no-num id=acknowledgments>Acknowledgments</h2>
  3.3362 +
  3.3363 +  <p>[acknowledgments]
  3.3364 +
  3.3365 +  <h2 class=no-num id=references>References</h2>
  3.3366 +
  3.3367 +  <h3 class=no-num id=normative-references>Normative references</h3>
  3.3368 +  <!--begin-normative-->
  3.3369 +  <!-- Sorted by label -->
  3.3370 +
  3.3371 +  <dl class=bibliography>
  3.3372 +   <dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
  3.3373 +    <!---->
  3.3374 +
  3.3375 +   <dt id=CSS3BOX>[CSS3BOX]
  3.3376 +
  3.3377 +   <dd>Bert Bos. <a
  3.3378 +    href="http://www.w3.org/TR/2007/WD-css3-box-20070809"><cite>CSS basic box
  3.3379 +    model.</cite></a> 9 August 2007. W3C Working Draft. (Work in progress.)
  3.3380 +    URL: <a
  3.3381 +    href="http://www.w3.org/TR/2007/WD-css3-box-20070809">http://www.w3.org/TR/2007/WD-css3-box-20070809</a>
  3.3382 +   </dd>
  3.3383 +   <!---->
  3.3384 +
  3.3385 +   <dt id=CSS3SYN>[CSS3SYN]
  3.3386 +
  3.3387 +   <dd>L. David Baron. <a
  3.3388 +    href="http://www.w3.org/TR/2003/WD-css3-syntax-20030813"><cite>CSS3
  3.3389 +    module: Syntax.</cite></a> 13 August 2003. W3C Working Draft. (Work in
  3.3390 +    progress.) URL: <a
  3.3391 +    href="http://www.w3.org/TR/2003/WD-css3-syntax-20030813">http://www.w3.org/TR/2003/WD-css3-syntax-20030813</a>
  3.3392 +   </dd>
  3.3393 +   <!---->
  3.3394 +
  3.3395 +   <dt id=CSS3VAL>[CSS3VAL]
  3.3396 +
  3.3397 +   <dd>Håkon Wium Lie; Tab Atkins; Elika J. Etemad. <a
  3.3398 +    href="http://www.w3.org/TR/2012/CR-css3-values-20120828/"><cite>CSS
  3.3399 +    Values and Units Module Level 3.</cite></a> 28 August 2012. W3C Candidate
  3.3400 +    Recommendation. (Work in progress.) URL: <a
  3.3401 +    href="http://www.w3.org/TR/2012/CR-css3-values-20120828/">http://www.w3.org/TR/2012/CR-css3-values-20120828/</a>
  3.3402 +   </dd>
  3.3403 +   <!---->
  3.3404 +  </dl>
  3.3405 +  <!--end-normative-->
  3.3406 +
  3.3407 +  <h3 class=no-num id=other-references>Other references</h3>
  3.3408 +  <!--begin-informative-->
  3.3409 +  <!-- Sorted by label -->
  3.3410 +
  3.3411 +  <dl class=bibliography>
  3.3412 +   <dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
  3.3413 +    <!---->
  3.3414 +
  3.3415 +   <dt id=CSS3BG>[CSS3BG]
  3.3416 +
  3.3417 +   <dd>Bert Bos; Elika J. Etemad; Brad Kemper. <a
  3.3418 +    href="http://www.w3.org/TR/2012/CR-css3-background-20120724/"><cite>CSS
  3.3419 +    Backgrounds and Borders Module Level 3.</cite></a> 24 July 2012. W3C
  3.3420 +    Candidate Recommendation. (Work in progress.) URL: <a
  3.3421 +    href="http://www.w3.org/TR/2012/CR-css3-background-20120724/">http://www.w3.org/TR/2012/CR-css3-background-20120724/</a>
  3.3422 +   </dd>
  3.3423 +   <!---->
  3.3424 +
  3.3425 +   <dt id=CSS3BORDER>[CSS3BORDER]
  3.3426 +
  3.3427 +   <dd>Tapas Roy. <a
  3.3428 +    href="http://www.w3.org/TR/2002/WD-css3-border-20021107"><cite>CSS3
  3.3429 +    module: Border.</cite></a> 7 November 2002. W3C Working Draft. (Work in
  3.3430 +    progress.) URL: <a
  3.3431 +    href="http://www.w3.org/TR/2002/WD-css3-border-20021107">http://www.w3.org/TR/2002/WD-css3-border-20021107</a>
  3.3432 +   </dd>
  3.3433 +   <!---->
  3.3434 +
  3.3435 +   <dt id=CSS3GCPM>[CSS3GCPM]
  3.3436 +
  3.3437 +   <dd>Håkon Wium Lie. <a
  3.3438 +    href="http://www.w3.org/TR/2010/WD-css3-gcpm-20100608"><cite>CSS
  3.3439 +    Generated Content for Paged Media Module.</cite></a> 8 June 2010. W3C
  3.3440 +    Working Draft. (Work in progress.) URL: <a
  3.3441 +    href="http://www.w3.org/TR/2010/WD-css3-gcpm-20100608">http://www.w3.org/TR/2010/WD-css3-gcpm-20100608</a>
  3.3442 +   </dd>
  3.3443 +   <!---->
  3.3444 +
  3.3445 +   <dt id=CSS3INTRO>[CSS3INTRO]
  3.3446 +
  3.3447 +   <dd>Eric A. Meyer; Bert Bos. <a
  3.3448 +    href="http://www.w3.org/TR/2001/WD-css3-roadmap-20010523"><cite>Introduction
  3.3449 +    to CSS3.</cite></a> 23 May 2001. W3C Working Draft. (Work in progress.)
  3.3450 +    URL: <a
  3.3451 +    href="http://www.w3.org/TR/2001/WD-css3-roadmap-20010523">http://www.w3.org/TR/2001/WD-css3-roadmap-20010523</a>
  3.3452 +   </dd>
  3.3453 +   <!---->
  3.3454 +
  3.3455 +   <dt id=CSS3LINE>[CSS3LINE]
  3.3456 +
  3.3457 +   <dd>Michel Suignard; Eric A. Meyer. <a
  3.3458 +    href="http://www.w3.org/TR/2002/WD-css3-linebox-20020515"><cite>CSS3
  3.3459 +    module: line.</cite></a> 15 May 2002. W3C Working Draft. (Work in
  3.3460 +    progress.) URL: <a
  3.3461 +    href="http://www.w3.org/TR/2002/WD-css3-linebox-20020515">http://www.w3.org/TR/2002/WD-css3-linebox-20020515</a>
  3.3462 +   </dd>
  3.3463 +   <!---->
  3.3464 +
  3.3465 +   <dt id=CSS3TEXT>[CSS3TEXT]
  3.3466 +
  3.3467 +   <dd>Elika J. Etemad; Koji Ishii. <a
  3.3468 +    href="http://www.w3.org/TR/2012/WD-css3-text-20120814/"><cite>CSS Text
  3.3469 +    Level 3.</cite></a> 14 August 2012. W3C Working Draft. (Work in
  3.3470 +    progress.) URL: <a
  3.3471 +    href="http://www.w3.org/TR/2012/WD-css3-text-20120814/">http://www.w3.org/TR/2012/WD-css3-text-20120814/</a>
  3.3472 +   </dd>
  3.3473 +   <!---->
  3.3474 +
  3.3475 +   <dt id=HTML40>[HTML40]
  3.3476 +
  3.3477 +   <dd>Ian Jacobs; David Raggett; Arnaud Le Hors. <a
  3.3478 +    href="http://www.w3.org/TR/1998/REC-html40-19980424"><cite>HTML 4.0
  3.3479 +    Specification.</cite></a> 24 April 1998. W3C Recommendation. URL: <a
  3.3480 +    href="http://www.w3.org/TR/1998/REC-html40-19980424">http://www.w3.org/TR/1998/REC-html40-19980424</a>
  3.3481 +   </dd>
  3.3482 +   <!---->
  3.3483 +  </dl>
  3.3484 +  <!--end-informative-->
  3.3485 +
  3.3486 +  <h2 class=no-num id=index>Index</h2>
  3.3487 +  <!--begin-index-->
  3.3488 +
  3.3489 +  <ul class=indexlist>
  3.3490 +   <li>after (caption-side), <a href="#after"
  3.3491 +    title="after (caption-side)"><strong>6.1.</strong></a>
  3.3492 +
  3.3493 +   <li>auto (table-layout), <a href="#auto"
  3.3494 +    title="auto (table-layout)"><strong>7.2.</strong></a>
  3.3495 +
  3.3496 +   <li>‘<a href="#background"><code
  3.3497 +    class=property>background</code></a>’, <a href="#background"
  3.3498 +    title="'background'"><strong>#</strong></a>
  3.3499 +
  3.3500 +   <li>baseline, <a href="#baseline" title=baseline><strong>7.3.</strong></a>
  3.3501 +
  3.3502 +   <li>baseline of a row, <a href="#baseline-of-the-row."
  3.3503 +    title="baseline of a row"><strong>7.3.</strong></a>
  3.3504 +
  3.3505 +   <li>baseline of a table, <a href="#baselines-of-the-table"
  3.3506 +    title="baseline of a table"><strong>10.</strong></a>
  3.3507 +
  3.3508 +   <li>before (caption-side), <a href="#before"
  3.3509 +    title="before (caption-side)"><strong>6.1.</strong></a>
  3.3510 +
  3.3511 +   <li>‘<a href="#border"><code class=property>border</code></a>’, <a
  3.3512 +    href="#border" title="'border'"><strong>#</strong></a>
  3.3513 +
  3.3514 +   <li>border-collapse, <a href="#border-collapse"
  3.3515 +    title=border-collapse><strong>8.</strong></a>
  3.3516 +
  3.3517 +   <li>border-spacing, <a href="#border-spacing"
  3.3518 +    title=border-spacing><strong>8.1.</strong></a>
  3.3519 +
  3.3520 +   <li>‘<a href="#border-style"><code
  3.3521 +    class=property>border-style</code></a>’, <a href="#border-style"
  3.3522 +    title="'border-style'"><strong>#</strong></a>
  3.3523 +
  3.3524 +   <li>‘<a href="#border-width"><code
  3.3525 +    class=property>border-width</code></a>’, <a href="#border-width"
  3.3526 +    title="'border-width'"><strong>#</strong></a>
  3.3527 +
  3.3528 +   <li>bottom, <a href="#bottom0" title=bottom><strong>7.3.</strong></a>
  3.3529 +
  3.3530 +   <li>bottom (caption-side), <a href="#bottom"
  3.3531 +    title="bottom (caption-side)"><strong>6.1.</strong></a>
  3.3532 +
  3.3533 +   <li>caption-side, <a href="#caption-side"
  3.3534 +    title=caption-side><strong>6.1.</strong></a>
  3.3535 +
  3.3536 +   <li>dashed, <a href="#dashed" title=dashed><strong>8.3.</strong></a>
  3.3537 +
  3.3538 +   <li>‘<a href="#direction"><code class=property>direction</code></a>’,
  3.3539 +    <a href="#direction" title="'direction'"><strong>#</strong></a>
  3.3540 +
  3.3541 +   <li>‘<a href="#display"><code class=css>display, <a href="#display"
  3.3542 +    title="</code>’display"><strong>#</strong></a> </code></a>
  3.3543 +
  3.3544 +   <li>dotted, <a href="#dotted" title=dotted><strong>8.3.</strong></a>
  3.3545 +
  3.3546 +   <li>double, <a href="#double" title=double><strong>8.3.</strong></a>
  3.3547 +
  3.3548 +   <li>empty-cells, <a href="#empty-cells0"
  3.3549 +    title=empty-cells><strong>8.1.1.</strong></a>
  3.3550 +
  3.3551 +   <li>fixed, <a href="#fixed" title=fixed><strong>7.2.</strong></a>
  3.3552 +
  3.3553 +   <li>groove, <a href="#groove" title=groove><strong>8.3.</strong></a>
  3.3554 +
  3.3555 +   <li>‘<a href="#height"><code class=property>height</code></a>’, <a
  3.3556 +    href="#height" title="'height'"><strong>#</strong></a>
  3.3557 +
  3.3558 +   <li>hidden, <a href="#hidden" title=hidden><strong>8.3.</strong></a>
  3.3559 +
  3.3560 +   <li>inline-table, <a href="#inline-table"
  3.3561 +    title=inline-table><strong>4.</strong></a>
  3.3562 +
  3.3563 +   <li>inset, <a href="#inset" title=inset><strong>8.3.</strong></a>
  3.3564 +
  3.3565 +   <li>internal table element, <a href="#�internal�-table-element"
  3.3566 +    title="internal table element"><strong>3.</strong></a>
  3.3567 +
  3.3568 +   <li>leaders, <a href="#leaders" title=leaders><strong>2.</strong></a>
  3.3569 +
  3.3570 +   <li>left (caption-side), <a href="#left"
  3.3571 +    title="left (caption-side)"><strong>6.1.</strong></a>
  3.3572 +
  3.3573 +   <li>mapping elements to table parts, <a href="#map"
  3.3574 +    title="mapping elements to table parts">3.</a>
  3.3575 +
  3.3576 +   <li>middle, <a href="#middle" title=middle><strong>7.3.</strong></a>
  3.3577 +
  3.3578 +   <li>none, <a href="#none" title=none><strong>8.3.</strong></a>
  3.3579 +
  3.3580 +   <li>outset, <a href="#outset" title=outset><strong>8.3.</strong></a>
  3.3581 +
  3.3582 +   <li>‘<a href="#overflow"><code class=property>overflow</code></a>’, <a
  3.3583 +    href="#overflow" title="'overflow'"><strong>#</strong></a>
  3.3584 +
  3.3585 +   <li>ridge, <a href="#ridge" title=ridge><strong>8.3.</strong></a>
  3.3586 +
  3.3587 +   <li>right (caption-side), <a href="#right"
  3.3588 +    title="right (caption-side)"><strong>6.1.</strong></a>
  3.3589 +
  3.3590 +   <li>solid, <a href="#solid" title=solid><strong>8.3.</strong></a>
  3.3591 +
  3.3592 +   <li>speak-header, <a href="#speak-header"
  3.3593 +    title=speak-header><strong>11.1.</strong></a>
  3.3594 +
  3.3595 +   <li>tab, <a href="#tab" title=tab><strong>2.</strong></a>
  3.3596 +
  3.3597 +   <li>tab-align, <a href="#tab-align"
  3.3598 +    title=tab-align><strong>2.</strong></a>
  3.3599 +
  3.3600 +   <li>table, <a href="#table" title=table><strong>4.</strong></a>
  3.3601 +
  3.3602 +   <li>tab-leaders, <a href="#tab-leaders"
  3.3603 +    title=tab-leaders><strong>2.</strong></a>
  3.3604 +
  3.3605 +   <li>tab-leaders-alignment, <a href="#tab-leaders-alignment"
  3.3606 +    title=tab-leaders-alignment><strong>2.</strong></a>
  3.3607 +
  3.3608 +   <li>table-baseline, <a href="#table-baseline"
  3.3609 +    title=table-baseline><strong>10.</strong></a>
  3.3610 +
  3.3611 +   <li>table-caption, <a href="#table-caption"
  3.3612 +    title=table-caption><strong>4.</strong></a>
  3.3613 +
  3.3614 +   <li>table-cell, <a href="#table-cell"
  3.3615 +    title=table-cell><strong>4.</strong></a>
  3.3616 +
  3.3617 +   <li>table-column, <a href="#table-column"
  3.3618 +    title=table-column><strong>4.</strong></a>
  3.3619 +
  3.3620 +   <li>table-column-group, <a href="#table-column-group"
  3.3621 +    title=table-column-group><strong>4.</strong></a>
  3.3622 +
  3.3623 +   <li>table-column-span, <a href="#table-column-span"
  3.3624 +    title=table-column-span><strong>9.</strong></a>
  3.3625 +
  3.3626 +   <li>table element, <a href="#table-element"
  3.3627 +    title="table element"><strong>3.</strong></a>
  3.3628 +    <ul>
  3.3629 +     <li>internal, <a href="#�internal�-table-element"
  3.3630 +      title="table element, internal"><strong>3.</strong></a>
  3.3631 +    </ul>
  3.3632 +
  3.3633 +   <li>table-footer-group, <a href="#table-footer-group"
  3.3634 +    title=table-footer-group><strong>4.</strong></a>
  3.3635 +
  3.3636 +   <li>table-header-group, <a href="#table-header-group0"
  3.3637 +    title=table-header-group><strong>4.</strong></a>
  3.3638 +
  3.3639 +   <li>table-layout, <a href="#table-layout"
  3.3640 +    title=table-layout><strong>7.2.</strong></a>
  3.3641 +
  3.3642 +   <li>table-row, <a href="#table-row"
  3.3643 +    title=table-row><strong>4.</strong></a>
  3.3644 +
  3.3645 +   <li>table-row-group, <a href="#table-row-group"
  3.3646 +    title=table-row-group><strong>4.</strong></a>
  3.3647 +
  3.3648 +   <li>table-row-span, <a href="#table-row-span"
  3.3649 +    title=table-row-span><strong>9.</strong></a>
  3.3650 +
  3.3651 +   <li>tab-position, <a href="#tab-position"
  3.3652 +    title=tab-position><strong>2.</strong></a>
  3.3653 +
  3.3654 +   <li>‘<a href="#text-align"><code
  3.3655 +    class=property>text-align</code></a>’, <a href="#text-align"
  3.3656 +    title="'text-align'"><strong>#</strong></a>
  3.3657 +
  3.3658 +   <li>top, <a href="#top0" title=top><strong>7.3.</strong></a>
  3.3659 +
  3.3660 +   <li>top (caption-side), <a href="#top"
  3.3661 +    title="top (caption-side)"><strong>6.1.</strong></a>
  3.3662 +
  3.3663 +   <li>‘<a href="#vertical-align"><code
  3.3664 +    class=property>vertical-align</code></a>’, <a href="#vertical-align"
  3.3665 +    title="'vertical-align'"><strong>#</strong></a>
  3.3666 +
  3.3667 +   <li>‘<a href="#visibility"><code
  3.3668 +    class=property>visibility</code></a>’, <a href="#visibility"
  3.3669 +    title="'visibility'"><strong>#</strong></a>
  3.3670 +
  3.3671 +   <li>‘<a href="#width"><code class=property>width</code></a>’, <a
  3.3672 +    href="#width" title="'width'"><strong>#</strong></a>
  3.3673 +  </ul>
  3.3674 +  <!--end-index-->
  3.3675 +
  3.3676 +  <h2 class=no-num id=property-index>Property index</h2>
  3.3677 +  <!--begin-properties-->
  3.3678 +
  3.3679 +  <table class=proptable>
  3.3680 +   <thead>
  3.3681 +    <tr>
  3.3682 +     <th>Property
  3.3683 +
  3.3684 +     <th>Values
  3.3685 +
  3.3686 +     <th>Initial
  3.3687 +
  3.3688 +     <th>Applies to
  3.3689 +
  3.3690 +     <th>Inh.
  3.3691 +
  3.3692 +     <th>Percentages
  3.3693 +
  3.3694 +     <th>Media
  3.3695 +
  3.3696 +   <tbody>
  3.3697 +    <tr>
  3.3698 +     <th><a class=property href="#border-collapse">border-collapse</a>
  3.3699 +
  3.3700 +     <td>collapse | separate
  3.3701 +
  3.3702 +     <td>collapse
  3.3703 +
  3.3704 +     <td>‘table’ and ‘inline-table’ elements
  3.3705 +
  3.3706 +     <td>yes
  3.3707 +
  3.3708 +     <td>N/A
  3.3709 +
  3.3710 +     <td>visual
  3.3711 +
  3.3712 +    <tr>
  3.3713 +     <th><a class=property href="#border-spacing">border-spacing</a>
  3.3714 +
  3.3715 +     <td>&lt;length&gt; &lt;length&gt;?
  3.3716 +
  3.3717 +     <td>0
  3.3718 +
  3.3719 +     <td>‘table’ and ‘inline-table’ elements*
  3.3720 +
  3.3721 +     <td>yes
  3.3722 +
  3.3723 +     <td>N/A
  3.3724 +
  3.3725 +     <td>visual
  3.3726 +
  3.3727 +    <tr>
  3.3728 +     <th><a class=property href="#caption-side">caption-side</a>
  3.3729 +
  3.3730 +     <td>[ top | bottom | left | right | before | after ] && outside?
  3.3731 +
  3.3732 +     <td>top
  3.3733 +
  3.3734 +     <td>‘table-caption’ elements
  3.3735 +
  3.3736 +     <td>yes
  3.3737 +
  3.3738 +     <td>N/A
  3.3739 +
  3.3740 +     <td>visual
  3.3741 +
  3.3742 +    <tr>
  3.3743 +     <th><a class=property href="#empty-cells0">empty-cells</a>
  3.3744 +
  3.3745 +     <td>show | hide
  3.3746 +
  3.3747 +     <td>show
  3.3748 +
  3.3749 +     <td>‘table-cell’ elements
  3.3750 +
  3.3751 +     <td>yes
  3.3752 +
  3.3753 +     <td>N/A
  3.3754 +
  3.3755 +     <td>visual
  3.3756 +
  3.3757 +    <tr>
  3.3758 +     <th><a class=property href="#speak-header">speak-header</a>
  3.3759 +
  3.3760 +     <td>once | always
  3.3761 +
  3.3762 +     <td>once
  3.3763 +
  3.3764 +     <td>elements that have table header information
  3.3765 +
  3.3766 +     <td>yes
  3.3767 +
  3.3768 +     <td>N/A
  3.3769 +
  3.3770 +     <td>aural
  3.3771 +
  3.3772 +    <tr>
  3.3773 +     <th><a class=property href="#tab-align">tab-align</a>
  3.3774 +
  3.3775 +     <td>left | top | center | right | bottom | &lt;string&gt; | none
  3.3776 +
  3.3777 +     <td>none
  3.3778 +
  3.3779 +     <td>inline-level elements
  3.3780 +
  3.3781 +     <td>no
  3.3782 +
  3.3783 +     <td>N/A
  3.3784 +
  3.3785 +     <td>visual
  3.3786 +
  3.3787 +    <tr>
  3.3788 +     <th><a class=property
  3.3789 +      href="#tab-leaders-alignment">tab-leaders-alignment</a>
  3.3790 +
  3.3791 +     <td>aligned | centered | distributed
  3.3792 +
  3.3793 +     <td>aligned
  3.3794 +
  3.3795 +     <td>inline-level elements
  3.3796 +
  3.3797 +     <td>no
  3.3798 +
  3.3799 +     <td>N/A
  3.3800 +
  3.3801 +     <td>visual
  3.3802 +
  3.3803 +    <tr>
  3.3804 +     <th><a class=property href="#tab-leaders">tab-leaders</a>
  3.3805 +
  3.3806 +     <td>&lt;string&gt;
  3.3807 +
  3.3808 +     <td>"" (empty string)
  3.3809 +
  3.3810 +     <td>inline-level elements
  3.3811 +
  3.3812 +     <td>no
  3.3813 +
  3.3814 +     <td>N/A
  3.3815 +
  3.3816 +     <td>visual
  3.3817 +
  3.3818 +    <tr>
  3.3819 +     <th><a class=property href="#table-baseline">table-baseline</a>
  3.3820 +
  3.3821 +     <td>&lt;integer&gt;
  3.3822 +
  3.3823 +     <td>1
  3.3824 +
  3.3825 +     <td>tables and inline-tables
  3.3826 +
  3.3827 +     <td>no
  3.3828 +
  3.3829 +     <td>N/A
  3.3830 +
  3.3831 +     <td>visual
  3.3832 +
  3.3833 +    <tr>
  3.3834 +     <th><a class=property href="#table-column-span">table-column-span</a>,
  3.3835 +      <a class=property href="#table-row-span">table-row-span</a>
  3.3836 +
  3.3837 +     <td>auto | attr(...)
  3.3838 +
  3.3839 +     <td>auto
  3.3840 +
  3.3841 +     <td>table cells
  3.3842 +
  3.3843 +     <td>no
  3.3844 +
  3.3845 +     <td>N/A
  3.3846 +
  3.3847 +     <td>visual
  3.3848 +
  3.3849 +    <tr>
  3.3850 +     <th><a class=property href="#table-layout">table-layout</a>
  3.3851 +
  3.3852 +     <td>auto | fixed
  3.3853 +
  3.3854 +     <td>auto
  3.3855 +
  3.3856 +     <td>‘table’ and ‘inline-table’ elements
  3.3857 +
  3.3858 +     <td>no
  3.3859 +
  3.3860 +     <td>N/A
  3.3861 +
  3.3862 +     <td>visual
  3.3863 +
  3.3864 +    <tr>
  3.3865 +     <th><a class=property href="#tab-position">tab-position</a>
  3.3866 +
  3.3867 +     <td>&lt;length&gt; | &lt;percentage&gt;
  3.3868 +
  3.3869 +     <td>0
  3.3870 +
  3.3871 +     <td>inline-level elements
  3.3872 +
  3.3873 +     <td>no
  3.3874 +
  3.3875 +     <td>width* of containing block
  3.3876 +
  3.3877 +     <td>visual
  3.3878 +
  3.3879 +    <tr>
  3.3880 +     <th><a class=property href="#tab">tab</a>
  3.3881 +
  3.3882 +     <td>[ &lt;‘tab-position’&gt; || &lt;‘tab-align’&gt; ] [ / [
  3.3883 +      &lt;‘tab-leaders’&gt; || &lt;‘tab-leaders-alignment’&gt; ] ]?
  3.3884 +
  3.3885 +     <td>see individual properties
  3.3886 +
  3.3887 +     <td>inline-level elements
  3.3888 +
  3.3889 +     <td>no
  3.3890 +
  3.3891 +     <td>see individual properties
  3.3892 +
  3.3893 +     <td>visual
  3.3894 +  </table>
  3.3895 +  <!--end-properties-->
  3.3896 +
  3.3897 +  <p>The following properties are defined in other modules: [Update when
  3.3898 +   border and background are merged.]
  3.3899 +
  3.3900 +  <ul>
  3.3901 +   <li><dfn id=background>‘<code class=property>background</code>’</dfn>
  3.3902 +    <a href="#CSS3BG" rel=biblioentry>[CSS3BG]<!--{{CSS3BG}}--></a>
  3.3903 +
  3.3904 +   <li><dfn id=border>‘<code class=property>border</code>’</dfn>, <dfn
  3.3905 +    id=border-style>‘<code class=property>border-style</code>’</dfn>,
  3.3906 +    <dfn id=border-width>‘<code class=property>border-width</code>’</dfn>
  3.3907 +    <a href="#CSS3BORDER"
  3.3908 +    rel=biblioentry>[CSS3BORDER]<!--{{CSS3BORDER}}--></a>
  3.3909 +
  3.3910 +   <li><dfn id=direction>‘<code class=property>direction</code>’</dfn>,
  3.3911 +    <dfn id=text-align>‘<code class=property>text-align</code>’</dfn> <a
  3.3912 +    href="#CSS3TEXT" rel=biblioentry>[CSS3TEXT]<!--{{CSS3TEXT}}--></a>
  3.3913 +
  3.3914 +   <li><dfn id=display>‘<code class=css>display</code></dfn>, <dfn
  3.3915 +    id=height>’height'</dfn>, <dfn id=overflow>‘<code
  3.3916 +    class=property>overflow</code>’</dfn>, <dfn id=width>‘<code
  3.3917 +    class=property>width</code>’</dfn> <a href="#CSS3BOX"
  3.3918 +    rel=biblioentry>[CSS3BOX]<!--{{!CSS3BOX}}--></a>
  3.3919 +
  3.3920 +   <li><dfn id=vertical-align>‘<code
  3.3921 +    class=property>vertical-align</code>’</dfn> <a href="#CSS3LINE"
  3.3922 +    rel=biblioentry>[CSS3LINE]<!--{{CSS3LINE}}--></a>
  3.3923 +
  3.3924 +   <li><dfn id=visibility>‘<code class=property>visibility</code>’</dfn>
  3.3925 +    [?]
  3.3926 +  </ul>
  3.3927 +</html>
  3.3928 +<!-- Keep this comment at the end of the file
  3.3929 +Local variables:
  3.3930 +mode:sgml
  3.3931 +sgml-declaration:"~/SGML/HTML4.decl"
  3.3932 +sgml-default-doctype-name:"html"
  3.3933 +sgml-minimize-attributes:t
  3.3934 +sgml-nofill-elements:("pre" "style" "br")
  3.3935 +sgml-live-element-indicator:t
  3.3936 +End:
  3.3937 +-->

     4.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     4.2 +++ b/css3-tables/Overview.src.html	Fri Jan 11 16:51:55 2013 +0100
     4.3 @@ -0,0 +1,2714 @@
     4.4 +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
     4.5 +<html lang="en">
     4.6 +<head>
     4.7 +  <title>CSS3 Tables Module</title>
     4.8 +  <link rel="stylesheet" type="text/css" href="../default.css">
     4.9 +  <style type="text/css">
    4.10 +  /* Just in case an incorrect max-width occurs in default.css */
    4.11 +  body {max-width: none !important}
    4.12 +  </style>
    4.13 +  <link rel="stylesheet" type="text/css"
    4.14 +  href="http://www.w3.org/StyleSheets/TR/W3C-MO">
    4.15 +</head>
    4.16 +
    4.17 +<body>
    4.18 +
    4.19 +<div class="head">
    4.20 +<!--logo-->
    4.21 +
    4.22 +<h1>CSS3 Tables Module</h1>
    4.23 +
    4.24 +<h2 class="no-num no-toc">[LONGSTATUS] [DATE: 21 Feb 2002]</h2>
    4.25 +<dl>
    4.26 +  <dt>This version:</dt>
    4.27 +    <dd><a
    4.28 +      href="[VERSION]">http://www.w3.org/[YEAR]/MO-css3-tables-[CDATE]</a></dd>
    4.29 +  <dt>Latest version:</dt>
    4.30 +    <dd><a
    4.31 +      href="[LATEST]">[LATEST]</a></dd>
    4.32 +  <dt>Previous version:</dt>
    4.33 +    <dd><a
    4.34 +      href="[http://www.w3.org/PreviousVersionURI]">[http://www.w3.org/PreviousVersionURI]</a></dd>
    4.35 +  <dt>Editors:</dt>
    4.36 +    <dd><a href="http://www.w3.org/People/Bos">Bert Bos</a>, <a
    4.37 +      href="http://www.w3.org/">W3C</a>, <a
    4.38 +      href="mailto:bert@w3.org">&lt;bert@w3.org&gt;</a></dd>
    4.39 +    <dd>[editor name, affiliation (opt.), email address (opt.)]</dd>
    4.40 +</dl>
    4.41 +
    4.42 +<!--copyright-->
    4.43 +
    4.44 +<hr title="Separator for header">
    4.45 +</div>
    4.46 +
    4.47 +
    4.48 +<h2 id=abstract class="no-num no-toc">Abstract</h2>
    4.49 +
    4.50 +<p>CSS (Cascading Style Sheets) is a language for specifying the
    4.51 +rendering of a structured document (in HTML or XML). See the CSS3
    4.52 +introduction [[CSS3INTRO]] for more on CSS. The <em>CSS3 table
    4.53 +module</em> is one of the modules of level 3 of CSS and defines the
    4.54 +properties that specify how tables are to be displayed visually or
    4.55 +spoken by a speech synthesizer.
    4.56 +
    4.57 +<p>This is a very rough draft. It consists of the text of
    4.58 +the CSS2 chapter on tables, with almost no changes yet., except for
    4.59 +the addition of the first section, "Tabs &amp; leaders."
    4.60 +
    4.61 +<h2 id=status class="no-num no-toc">Status of this document</h2>
    4.62 +
    4.63 +<p style="background: #fdd; color: red; font-weight: bold; text-align: center; padding: .5em; border: thick solid red; border-radius: 1em">This specification is not being actively maintained, and should not be used as a guide for implementations.  It may be revived in the future, but for now should be considered obsolete.  <br>If you have questions or comments on this specification, please send an email to the CSS Working Group's mailing list at <a href="mailto:www-style@w3.org">www-style@w3.org</a>.  (Before sending mail for the first time, you have to subscribe at <a href="http://lists.w3.org/Archives/Public/www-style/">http://lists.w3.org/Archives/Public/www-style/</a>.)</p>
    4.64 +
    4.65 +<!--status-->
    4.66 +
    4.67 +<p>The text hasn't yet been synchronized with the latest version of
    4.68 +CSS 2.1.
    4.69 +
    4.70 +<h2 class="no-num no-toc"><a name="contents">Table of contents</a></h2>
    4.71 +
    4.72 +<!--toc-->
    4.73 +
    4.74 +<hr>
    4.75 +
    4.76 +<h2>Dependencies on other modules</h2>
    4.77 +
    4.78 +<p>This CSS3 module depends on the following other CSS3 modules:
    4.79 +<ul>
    4.80 +  <li>CSS3 Box Model [[!CSS3BOX]]
    4.81 +  <li>CSS3 Syntax Module [[!CSS3SYN]]
    4.82 +  <li>CSS3 Values and Units Module [[!CSS3VAL]]
    4.83 +  <li>[module]
    4.84 +</ul>
    4.85 +
    4.86 +<h2>The 'tab' properties: tabs and leaders</h2>
    4.87 +
    4.88 +<p class="issue">[Does it belong here, or in the line box model?]
    4.89 +
    4.90 +<p class="issue">[This material is new. (Well, actually, <a
    4.91 +href="css-tabs.html">it dates from 1996</a>, but it is new in this
    4.92 +draft.) Not reviewed yet in any way.]
    4.93 +
    4.94 +<p class="issue">[The name "tab" maybe reminds people too much of the tab
    4.95 +character, which plays no role here at all. Maybe a different name is better.
    4.96 +"Anchor"?]
    4.97 +
    4.98 +<p class="issue">[Could this be merged with the margin-left/margin-right
    4.99 +properties to save some properties? 'margin-left: 25% fixed' instead of 'tab:
   4.100 +25% left'?]
   4.101 +
   4.102 +<p class=issue>Håkon will write a proposal for a
   4.103 +'leader(&lt;string&gt;)' notation that can be put in the 'content'
   4.104 +property, inside '::after' and '::before', independent of any tab
   4.105 +properties. It will push everything after it (up to the end of the
   4.106 +block or the explicit next line break, whichever comes first) forward,
   4.107 +so that it ends at the end of a line. Often, that may make tabs
   4.108 +unnecessary. [12 Jan 2005] That proposal is now in [[CSS3GCPM]].
   4.109 +
   4.110 +<table class="propdef">
   4.111 +  <tbody>
   4.112 +    <tr>
   4.113 +      <td><em>Name:</em>
   4.114 +      <td><dfn>tab-position</dfn>
   4.115 +    
   4.116 +    <tr>
   4.117 +      <td><em>Value:</em>
   4.118 +      <td><var>&lt;length&gt;</var> | <var>&lt;percentage&gt;</var>
   4.119 +    
   4.120 +    <tr>
   4.121 +      <td><em>Initial:</em>
   4.122 +      <td>0
   4.123 +    
   4.124 +    <tr>
   4.125 +      <td><em>Applies to:</em>
   4.126 +      <td>inline-level elements
   4.127 +    
   4.128 +    <tr>
   4.129 +      <td><em>Inherited:</em>
   4.130 +      <td>no
   4.131 +    
   4.132 +    <tr>
   4.133 +      <td><em>Percentages:</em>
   4.134 +      <td>width* of containing block
   4.135 +    
   4.136 +    <tr>
   4.137 +      <td><em>Media:</em>
   4.138 +      <td>visual
   4.139 +    
   4.140 +    <tr>
   4.141 +      <td><em>Computed&nbsp;value:</em>
   4.142 +      <td>&lt;length&gt;
   4.143 +    
   4.144 +    <tr>
   4.145 +      <td colspan="2">*) if the containing block is 'horizontal', otherwise
   4.146 +        height
   4.147 +    
   4.148 +  
   4.149 +</table>
   4.150 +
   4.151 +<table class="propdef">
   4.152 +  <tbody>
   4.153 +    <tr>
   4.154 +      <td><em>Name:</em>
   4.155 +      <td><dfn>tab-align</dfn>
   4.156 +    
   4.157 +    <tr>
   4.158 +      <td><em>Value:</em>
   4.159 +      <td>left | top | center | right | bottom | <var>&lt;string&gt;</var> |
   4.160 +        none
   4.161 +    
   4.162 +    <tr>
   4.163 +      <td><em>Initial:</em>
   4.164 +      <td>none
   4.165 +    
   4.166 +    <tr>
   4.167 +      <td><em>Applies to:</em>
   4.168 +      <td>inline-level elements
   4.169 +    
   4.170 +    <tr>
   4.171 +      <td><em>Inherited:</em>
   4.172 +      <td>no
   4.173 +    
   4.174 +    <tr>
   4.175 +      <td><em>Percentages:</em>
   4.176 +      <td>N/A
   4.177 +    
   4.178 +    <tr>
   4.179 +      <td><em>Media:</em>
   4.180 +      <td>visual
   4.181 +    
   4.182 +    <tr>
   4.183 +      <td><em>Computed&nbsp;value:</em>
   4.184 +      <td>specified value
   4.185 +    
   4.186 +  
   4.187 +</table>
   4.188 +
   4.189 +<table class="propdef">
   4.190 +  <tbody>
   4.191 +    <tr>
   4.192 +      <td><em>Name:</em>
   4.193 +      <td><dfn>tab-leaders</dfn>
   4.194 +    
   4.195 +    <tr>
   4.196 +      <td><em>Value:</em>
   4.197 +      <td><var>&lt;string&gt;</var>
   4.198 +    
   4.199 +    <tr>
   4.200 +      <td><em>Initial:</em>
   4.201 +      <td>"" (empty string)
   4.202 +    
   4.203 +    <tr>
   4.204 +      <td><em>Applies to:</em>
   4.205 +      <td>inline-level elements
   4.206 +    
   4.207 +    <tr>
   4.208 +      <td><em>Inherited:</em>
   4.209 +      <td>no
   4.210 +    
   4.211 +    <tr>
   4.212 +      <td><em>Percentages:</em>
   4.213 +      <td>N/A
   4.214 +    
   4.215 +    <tr>
   4.216 +      <td><em>Media:</em>
   4.217 +      <td>visual
   4.218 +    
   4.219 +    <tr>
   4.220 +      <td><em>Computed&nbsp;value:</em>
   4.221 +      <td>specified value
   4.222 +    
   4.223 +  
   4.224 +</table>
   4.225 +
   4.226 +<table class="propdef">
   4.227 +  <tbody>
   4.228 +    <tr>
   4.229 +      <td><em>Name:</em>
   4.230 +      <td><dfn>tab-leaders-alignment</dfn>
   4.231 +    
   4.232 +    <tr>
   4.233 +      <td><em>Value:</em>
   4.234 +      <td>aligned | centered | distributed
   4.235 +    
   4.236 +    <tr>
   4.237 +      <td><em>Initial:</em>
   4.238 +      <td>aligned
   4.239 +    
   4.240 +    <tr>
   4.241 +      <td><em>Applies to:</em>
   4.242 +      <td>inline-level elements
   4.243 +    
   4.244 +    <tr>
   4.245 +      <td><em>Inherited:</em>
   4.246 +      <td>no
   4.247 +    
   4.248 +    <tr>
   4.249 +      <td><em>Percentages:</em>
   4.250 +      <td>N/A
   4.251 +    
   4.252 +    <tr>
   4.253 +      <td><em>Media:</em>
   4.254 +      <td>visual
   4.255 +    
   4.256 +    <tr>
   4.257 +      <td><em>Computed&nbsp;value:</em>
   4.258 +      <td>specified value
   4.259 +    
   4.260 +  
   4.261 +</table>
   4.262 +
   4.263 +<table class="propdef">
   4.264 +  <tbody>
   4.265 +    <tr>
   4.266 +      <td><em>Name:</em>
   4.267 +      <td><dfn>tab</dfn>
   4.268 +    
   4.269 +    <tr>
   4.270 +      <td><em>Value:</em>
   4.271 +      <td>[ &lt;'tab-position'&gt; || &lt;'tab-align'&gt; ] [ / [
   4.272 +        &lt;'tab-leaders'&gt; || &lt;'tab-leaders-alignment'&gt; ] ]?
   4.273 +    
   4.274 +    <tr>
   4.275 +      <td><em>Initial:</em>
   4.276 +      <td>see individual properties
   4.277 +    
   4.278 +    <tr>
   4.279 +      <td><em>Applies to:</em>
   4.280 +      <td>inline-level elements
   4.281 +    
   4.282 +    <tr>
   4.283 +      <td><em>Inherited:</em>
   4.284 +      <td>no
   4.285 +    
   4.286 +    <tr>
   4.287 +      <td><em>Percentages:</em>
   4.288 +      <td>see individual properties
   4.289 +    
   4.290 +    <tr>
   4.291 +      <td><em>Media:</em>
   4.292 +      <td>visual
   4.293 +    
   4.294 +    <tr>
   4.295 +      <td><em>Computed&nbsp;value:</em>
   4.296 +      <td>see individual properties
   4.297 +    
   4.298 +  
   4.299 +</table>
   4.300 +
   4.301 +<p>An inline element can be put at a specific position in the line by setting
   4.302 +the element's <span class="property">'tab'</span> property. The space that
   4.303 +creates before the element can be filled with <dfn>leaders</dfn> or left
   4.304 +blank.
   4.305 +
   4.306 +<div class="example">
   4.307 +<p>Here are some examples:
   4.308 +<pre>signature { tab: 100% right }      /* right-aligned at end of line */
   4.309 +amount { tab: -1em "." }           /* aligned on dot, 1em from end of line */
   4.310 +desc { tab: 0 left }               /* left-aligned to start of line */
   4.311 +pageno { tab: 100% right / " . " } /* right-aligned, with dot leaders */
   4.312 +col2 { tab: 50% center / " · " }   /* centered in the line */</pre>
   4.313 +
   4.314 +<p>With a document fragment like the following:
   4.315 +<pre>&lt;expenses&gt;
   4.316 +&lt;desc&gt;Hotel&lt;/desc&gt; &lt;amount&gt;374.55&lt;/amount&gt;
   4.317 +&lt;desc&gt;Travel&lt;/desc&gt; &lt;amount&gt;1460.10&lt;/amount&gt;
   4.318 +&lt;desc&gt;Miscellaneous, including presents and
   4.319 +tips&lt;/desc&gt; &lt;amount&gt;84.00&lt;/amount&gt;
   4.320 +&lt;desc&gt;Total&lt;/desc&gt; &lt;amount&gt;1918.65&lt;/amount&gt;
   4.321 +&lt;signature&gt;Ph. Fogg&lt;/signature&gt;
   4.322 +&lt;/expenses&gt;</pre>
   4.323 +
   4.324 +<p>The rendering might be as follows:
   4.325 +
   4.326 +<div class="figure">
   4.327 +<p><img src="tabs.png" alt="[image]">
   4.328 +
   4.329 +<p class="caption">Possible rendering of a text with tabs and leaders
   4.330 +</div>
   4.331 +</div>
   4.332 +
   4.333 +<p>The <span class="property">'tab-position'</span> and <span
   4.334 +class="property">'tab-align'</span> determine the position of the element in
   4.335 +the line. The element is positioned by inserting extra whitespace or leaders
   4.336 +before it. Setting a tab will never cause the element to overlap any other
   4.337 +element on the line (unless it would already overlap without the tab, because
   4.338 +of negative margins). It may be necessary for the UA to insert so much
   4.339 +whitespace/leaders, that the alignment point of the tab occurs on one of the
   4.340 +following lines. (The example above shows one such case.)
   4.341 +
   4.342 +<p>The <span class="property">'tab-position'</span> gives the position of a
   4.343 +point on the line to which the element will be aligned. A negative
   4.344 +<var>&lt;length&gt;</var> is measured from the end of the line, a nonnegative
   4.345 +one from the beginning. Ditto for percentages, where percentages are relative
   4.346 +to the width of the <span>containing block</span> (or height, if the
   4.347 +containing block's <span>orientation</span> is vertical). It depends on the
   4.348 +writing mode of the containing block which edge is the start of the line.
   4.349 +<span class="issue">[Or is it more intuitive to always count positive lengths
   4.350 +from the left or top and negative ones from the right or bottom?]</span>
   4.351 +
   4.352 +<p>The position is measured from the <em>content edge</em> of the containing
   4.353 +block and is independent of any floats that may make the line box narrower
   4.354 +than the content box. As usual for inline elements in the presence of floats,
   4.355 +the alignment point and the element to which it belongs will be moved to a
   4.356 +following line, if it would otherwise overlap the float.
   4.357 +
   4.358 +<p class="note">Note that a value of '0' means the start of the line. Use
   4.359 +100% to refer to the end of the line.
   4.360 +
   4.361 +<p><span class="property">'Tab-align'</span> specifies how the element is
   4.362 +aligned to the alignment point:
   4.363 +<dl>
   4.364 +  <dt>'none'</dt>
   4.365 +    <dd>The element is not aligned to any alignment point and is put
   4.366 +      immediately after the previous element, with no intervening
   4.367 +    leaders.</dd>
   4.368 +  <dt>'left', 'top'</dt>
   4.369 +    <dd>These are the same and mean that the left <em>margin edge</em> (or
   4.370 +      top, if vertical) of the element is at the given position in the line.
   4.371 +      <p>If the element consists of multiple boxes (because of bidi
   4.372 +      processing or line breaks), which of the boxes is aligned depends on
   4.373 +      the <span class="property">'direction'</span> of the containing block:
   4.374 +      the first box in the case of <span class="css">'ltr'</span>, the last
   4.375 +      box in the case of <span class="css">'rtl'</span>.
   4.376 +    </dd>
   4.377 +  <dt>'right', 'bottom'</dt>
   4.378 +    <dd>The right <em>margin edge</em> (or bottom, if vertical) is at the
   4.379 +      given position. If the <span class="property">'direction'</span> of the
   4.380 +      containing block is <span class="css">'ltr'</span>, the element's last
   4.381 +      box is aligned, otherwise the first box.</dd>
   4.382 +  <dt>'center'</dt>
   4.383 +    <dd>The element is centered around the given position. If a line break
   4.384 +      occurs inside the element, the element might not be centered
   4.385 +    exactly.</dd>
   4.386 +  <dt><var>&lt;string&gt;</var></dt>
   4.387 +    <dd>The beginning of the first occurrence of the string in the element is
   4.388 +      put at the alignment point. If the string does not occur in the
   4.389 +      element, the end of the content of the element is aligned.</dd>
   4.390 +</dl>
   4.391 +
   4.392 +<p class="issue">[Do we need 'start' and 'end' keywords that dynamically
   4.393 +resolve to 'left' or 'right' depending on the writing direction? Probably not
   4.394 +very useful. Ltr and rtl are not symmetrical: even in rtl text, numbers are
   4.395 +right aligned.]
   4.396 +
   4.397 +<p>The <span class="property">'tab-leaders'</span> property determines what
   4.398 +is inserted before the element to make it align. If the value is the empty
   4.399 +string, only whitespace is inserted, otherwise multiple copies of the string
   4.400 +are inserted, as many as needed. If there is not room for a whole number of
   4.401 +copies, the remaining part is filled with whitespace. The style (color, font,
   4.402 +etc.) of the leaders is that of the element's parent (i.e., not necessarily
   4.403 +the same as the element's own style).
   4.404 +
   4.405 +<p>The values of <span class="property">'tab-leaders-alignment'</span> have
   4.406 +the following meaning:
   4.407 +<dl>
   4.408 +  <dt>'centered'</dt>
   4.409 +    <dd>If the space for the leaders is not a whole number of copies of the
   4.410 +      <span class="property">'tab-leaders'</span> string, half of the extra
   4.411 +      whitespace is inserted before the first string, and half after the last
   4.412 +      string. (If there is a line break the middle of the leaders, it may not
   4.413 +      be possible to have exactly half the space on both sides.)</dd>
   4.414 +  <dt>'distributed'</dt>
   4.415 +    <dd>Like for <span class="css">'centered'</span>, but the extra
   4.416 +      whitespace is inserted in equal amounts before the first, after the
   4.417 +      last and between the strings.</dd>
   4.418 +  <dt>'aligned'</dt>
   4.419 +    <dd>The <span class="property">'tab-leaders'</span> strings are
   4.420 +      positioned such that there is room for exactly a whole number of copies
   4.421 +      between the string and the left content edge of the containing block.
   4.422 +      <span class="note">Note that this has the effect that all 'aligned'
   4.423 +      leaders on different lines are aligned with each other, as if they were
   4.424 +      attached to a common grid. The dot leaders in the previous example form
   4.425 +      such a grid.</span></dd>
   4.426 +</dl>
   4.427 +
   4.428 +<p>The <span class="property">'tab'</span> property is a shorthand to set all
   4.429 +four properties together. Omitted values default to their initial values.
   4.430 +
   4.431 +<p class="note">Note the slash (/) in the value of <span
   4.432 +class="property">'tab'</span>: if leaders are specified, they must be
   4.433 +separated from the position &amp; alignment with a slash.
   4.434 +
   4.435 +<p class="note">Note that <span class="css">'tab: 2em / "."'</span> is a
   4.436 +valid, and occasionally useful declaration, but by itself does not cause any
   4.437 +leaders to appear, because it implicitly sets <span
   4.438 +class="property">'tab-align'</span> to <span class="css">'none'</span>.
   4.439 +
   4.440 +<p>Justification and line breaking algorithms may change the size of an
   4.441 +element, but leave it aligned at the alignment point. (Although different
   4.442 +algorithms and different settings of the relevant properties may cause the
   4.443 +alignment point to fall on different lines.)
   4.444 +
   4.445 +<p class="issue">[Do we need keywords such as 'arrow-leader (for a stretchy
   4.446 +arrow) or 'double-arrow-leader', or can they be made from existing
   4.447 +characters? Or should 'tab-leaders' accept up to 3 strings, e.g., "\2190"
   4.448 +"\2500" "\2192" ("&#x2190;" "&#x2500;" "&#x2192;"), for start, middle and end
   4.449 +of the leaders?]
   4.450 +
   4.451 +<h2>Introduction to tables</h2>
   4.452 +
   4.453 +<p class=issue>What happens with tables in vertical text
   4.454 +('writing-mode: tb-rl' etc.)? Are tables rotated or not? Currently,
   4.455 +the specification says rows are horizontal and the only influence is
   4.456 +from 'direction', which may cause the next column to be on the left of
   4.457 +the current one instead of the right.
   4.458 +
   4.459 +<p>Table mark-up in a source document typically represents a
   4.460 +particular relationship between three or more dimensions of data,
   4.461 +e.g., dates, products and the number of units sold. Table properties
   4.462 +in CSS are meant to style the representation of such data as a table.
   4.463 +But the properties can occasionally also be used to align elements in
   4.464 +rows and columns for purely visual reasons, rather than semantics.
   4.465 +Unlike, e.g., the <code class=html>table</code> element in HTML, the
   4.466 +<span class=property>'table'</span> keyword doesn't imply any
   4.467 +particular semantic relation between elements in the document.
   4.468 +
   4.469 +<div class=example><p>
   4.470 +Here is a simple three-row, three-column 
   4.471 +table described in HTML&nbsp;4:
   4.472 +
   4.473 +<pre class="html-example">
   4.474 +&lt;TABLE&gt;
   4.475 +&lt;CAPTION&gt;This is a simple 3x3 table&lt;/CAPTION&gt;
   4.476 +&lt;TR id="row1"&gt;
   4.477 +   &lt;TH&gt;Header 1  &lt;TD&gt;Cell 1  &lt;TD&gt;Cell 2
   4.478 +&lt;TR id="row2"&gt;
   4.479 +   &lt;TH&gt;Header 2  &lt;TD&gt;Cell 3  &lt;TD&gt;Cell 4
   4.480 +&lt;TR id="row3"&gt;
   4.481 +   &lt;TH&gt;Header 3  &lt;TD&gt;Cell 5  &lt;TD&gt;Cell 6
   4.482 +&lt;/TABLE&gt;
   4.483 +</pre>
   4.484 +
   4.485 +<p>This code creates one table (the <code class=html>TABLE</code>
   4.486 +element), three rows (the <code class=html>TR</code> elements), three
   4.487 +header cells (the <code class=html>TH</code> elements), and six data
   4.488 +cells (the <code class=html>TD</code> elements). Note that the three
   4.489 +columns of this example are specified implicitly: there are as many
   4.490 +columns in the table as required by header and data cells.
   4.491 +
   4.492 +<p>The following CSS rule centers the text horizontally in the header
   4.493 +cells and presents the text in the header cells with a bold font
   4.494 +weight:
   4.495 +
   4.496 +<pre>
   4.497 +th { text-align: center; font-weight: bold }
   4.498 +</pre>
   4.499 +
   4.500 +<p>The next rules align the text of the header cells on their baseline
   4.501 +and vertically center the text in each data cell:
   4.502 +
   4.503 +<pre>
   4.504 +th { vertical-align: baseline }
   4.505 +td { vertical-align: middle }
   4.506 +</pre>
   4.507 +
   4.508 +<p>The next rules specify that the top row will be surrounded by a 3px
   4.509 +solid blue border and each of the other rows will be surrounded by a
   4.510 +1px solid black border:
   4.511 +
   4.512 +<pre>
   4.513 +table   { border-collapse: collapse }
   4.514 +tr#row1 { border: 3px solid blue }
   4.515 +tr#row2 { border: 1px solid black }
   4.516 +tr#row3 { border: 1px solid black }
   4.517 +</pre>
   4.518 +
   4.519 +<p>Note, however, that the borders around the rows overlap where the
   4.520 +rows meet. What color (black or blue) and thickness (1px or 3px) will
   4.521 +the border between row1 and row2 be? We discuss this in the section on
   4.522 +<a href="#border-conflict-resolution">border conflict resolution.</a>
   4.523 +
   4.524 +<p>The following rule puts the table caption above the table:
   4.525 +
   4.526 +<pre>
   4.527 +caption { caption-side: top }
   4.528 +</pre>
   4.529 +
   4.530 +</div>
   4.531 +
   4.532 +<p>The preceding example shows how CSS works with HTML 4 elements;
   4.533 +in HTML 4, the semantics of the various table elements (TABLE,
   4.534 +CAPTION, THEAD, TBODY, TFOOT, COL, COLGROUP, TH, and TD) are
   4.535 +well-defined. In other document languages (such as XML applications),
   4.536 +there may not be pre-defined table elements. Therefore, CSS&nbsp;2.1 allows
   4.537 +authors to <span class="index-inst" title="mapping elements to table
   4.538 +parts">"map"</span> document language elements to table elements via
   4.539 +the <span class="propinst-display">'display'</span> property. For
   4.540 +example, the following rule makes the FOO element act like an HTML
   4.541 +TABLE element and the BAR element act like a CAPTION element:</p>
   4.542 +
   4.543 +<PRE class="example">
   4.544 +FOO { display : table }
   4.545 +BAR { display : table-caption }
   4.546 +</pre>
   4.547 +
   4.548 +<p id=internal>We discuss the various table elements in the
   4.549 +following section. In
   4.550 +this specification, the term <span class="index-def" title="table
   4.551 +element"><dfn>table element</dfn></span> refers to any element
   4.552 +involved in the creation of a table. An <span class="index-def"
   4.553 +title="internal table element|table
   4.554 +element::internal">“internal”
   4.555 +table element</span> is one that produces a row, row group, column,
   4.556 +column group, or cell.
   4.557 +
   4.558 +<h2>The CSS table model</h2>
   4.559 +
   4.560 +<p>The CSS table model is based on the HTML&nbsp;4.0 table model, in
   4.561 +which the structure of a table closely parallels the visual layout of
   4.562 +the table. In this model, a table consists of an optional caption and
   4.563 +any number of rows of cells. The table model is said to be “row
   4.564 +primary,&#8221 since authors specify rows, not columns, explicitly in the
   4.565 +document language. Columns are derived once all the rows have been
   4.566 +specified: the first cell of each row belongs to the first column,
   4.567 +the second to the second column, etc.). Rows and columns may be
   4.568 +grouped structurally and this grouping reflected in presentation
   4.569 +(e.g., a border may be drawn around a group of rows).
   4.570 +
   4.571 +<p>Thus, the table model consists of tables, captions, rows, row
   4.572 +groups, columns, column groups, and cells.
   4.573 +
   4.574 +<p>The CSS model does not require that the <span>document
   4.575 +language</span> include elements
   4.576 +that correspond to each of these components.  For document languages
   4.577 +(such as XML applications) that do not have pre-defined table
   4.578 +elements, authors must map document language elements to table
   4.579 +elements; this is done with the
   4.580 +'display' property. The following
   4.581 +'display' values assign table
   4.582 +formatting rules to an arbitrary element:
   4.583 +
   4.584 +<dl>
   4.585 +  <dt><dfn>table</dfn> (In HTML: TABLE) <dd>Specifies that an element
   4.586 +  defines a <em>block-level</em> table: it is a rectangular block that
   4.587 +  participates in a <em>block formatting context</em>.
   4.588 +
   4.589 +  <dt><dfn>inline-table</dfn> (In HTML: TABLE) <dd>Specifies that an
   4.590 +  element defines an <em>inline-level</em> table: it is a rectangular
   4.591 +  block that participates in an <em>inline formatting context</em>.
   4.592 +
   4.593 +  <dt><dfn>table-row</dfn> (In HTML:
   4.594 +  TR) <dd>Specifies that an element is a row of cells.
   4.595 +
   4.596 +  <dt><dfn>table-row-group</dfn>
   4.597 +  (In HTML: TBODY) <dd>Specifies that an element groups one or more
   4.598 +  rows.
   4.599 +
   4.600 +  <dt><dfn>table-header-group</dfn>
   4.601 +  (In HTML: THEAD) <dd>Like 'table-row-group', but for visual
   4.602 +  formatting, the row group is always displayed before all other rows
   4.603 +  and row groups and after any top captions. Print user agents may
   4.604 +  repeat header rows on each page spanned by a table. If a table
   4.605 +  contains multiple elements with 'display: table-header-group', only
   4.606 +  the first is rendered as a header; the others are treated as if they
   4.607 +  had 'display: table-row-group'.
   4.608 +
   4.609 +  <dt><dfn>table-footer-group</dfn>
   4.610 +  (In HTML: TFOOT) <dd>Like 'table-row-group', but for visual
   4.611 +  formatting, the row group is always displayed after all other rows
   4.612 +  and row groups and before any bottom captions. Print user agents may
   4.613 +  repeat footer rows on each page spanned by a table. If a table
   4.614 +  contains multiple elements with 'display: table-footer-group', only
   4.615 +  the first is rendered as a footer; the others are treated as if they
   4.616 +  had 'display: table-row-group'.
   4.617 +
   4.618 +  <dt><dfn>table-column</dfn> (In
   4.619 +  HTML: COL) <dd>Specifies that an element describes a column of
   4.620 +  cells.
   4.621 +
   4.622 +  <dt><dfn>table-column-group</dfn>
   4.623 +  (In HTML: COLGROUP) <dd>Specifies that an element groups one or more
   4.624 +  columns.
   4.625 +
   4.626 +  <dt><dfn>table-cell</dfn> (In HTML:
   4.627 +  TD, TH) <dd>Specifies that an element represents a table cell.
   4.628 +
   4.629 +  <dt><dfn>table-caption</dfn> (In
   4.630 +  HTML: CAPTION) <dd>Specifies a caption for the table. All elements
   4.631 +  with 'display: table-caption' must be rendered, as described in
   4.632 +  <a href="#model">section [??].</a>
   4.633 +</dl>
   4.634 +
   4.635 +<p>Replaced elements with these
   4.636 +'display' values are treated as their
   4.637 +given display types during layout. For example, an image that is set
   4.638 +to 'display: table-cell' will fill the available cell space, and its
   4.639 +dimensions might contribute towards the table sizing algorithms, as
   4.640 +with an ordinary cell.
   4.641 +
   4.642 +<p>Elements with 'display' set
   4.643 +to 'table-column' or 'table-column-group' are not rendered (exactly as
   4.644 +if they had 'display: none'), but they are useful, because they may
   4.645 +have attributes which induce a certain style for the columns they
   4.646 +represent.
   4.647 +
   4.648 +<div class=issue>
   4.649 +<p>The above, rewritten for 'display-model' and 'display-role':
   4.650 +
   4.651 +<p>The values of <span class=property>'display-model'</span> that
   4.652 +apply to tables have the following meaning. (For the purposes of the
   4.653 +definitions in this section, any child elements with a <span
   4.654 +class=property>'display-role'</span> of <span class=css>'none'</span>
   4.655 +are considered to have been removed from the document tree.)
   4.656 +
   4.657 +<dl>
   4.658 +  <dt>table
   4.659 +  <dd>
   4.660 +    <p>The child elements are laid out as a stack of row-groups. In
   4.661 +    detail:
   4.662 +
   4.663 +    <p>Any uninterrupted sequence of child elements, including
   4.664 +    anonymous ones, with a role other than <span
   4.665 +    class=css>'table-{row,header,footer}-group'</span> or <span
   4.666 +    class=css>'table-caption'</span> is wrapped in an anonymous
   4.667 +    element with role and model both set to <span
   4.668 +    class=css>'table-row-group'</span>.
   4.669 +
   4.670 +    <p>The resulting set of children is laid out as a stack of rows
   4.671 +    from top to bottom, with at the top any <span
   4.672 +    class=css>'table-header-group'</span> child, then the <span
   4.673 +    class=css>'table-row-group'</span> children, in the order of the
   4.674 +    document, and finally any <span
   4.675 +    class=css>'table-footer-group'</span> child. (Note also the
   4.676 +    difference between these three types for paged media, described <a
   4.677 +    href="#table-header-group">below.</a>)
   4.678 +
   4.679 +  <dt>table-row-group
   4.680 +  <dd>
   4.681 +    <p>The children are laid out as a stack of rows. In detail:
   4.682 +
   4.683 +    <p>Any uninterrupted sequence of child elements with a role other
   4.684 +    than <span class=css>'table-row'</span> is wrapped in an anonymous
   4.685 +    element with role set to <span class=css>'table-row'</span> and
   4.686 +    model set to <span class=css>'block-inside'</span>.
   4.687 +
   4.688 +    <p>The resulting children are laid out as a stack of rows from top
   4.689 +    to bottom in the order of the document.
   4.690 +
   4.691 +  <dt>table-row
   4.692 +  <dd>
   4.693 +    <p>The children are laid out as a row of table cells. In detail:
   4.694 +
   4.695 +    <p>Any uninterrupted sequence of children with a role other than
   4.696 +    <span class=css>'table-cell'</span> is wrapped in an anonymous
   4.697 +    element with role set to <span class=css>'table-cell'</span> and
   4.698 +    model set to <span class=css>'block'</span>.
   4.699 +
   4.700 +    <p>The resulting children are laid out from left to right in the
   4.701 +    order of the document.
   4.702 +
   4.703 +  <dt>table-column-group
   4.704 +  <dd>
   4.705 +    <p>Any children with a role other than <span
   4.706 +    class=css>'table-column'</span> are ignored. The other children
   4.707 +    aren't rendered either, but some of their properties influence the
   4.708 +    style of the table. See the section <a
   4.709 +    href="#columns">Columns</a> below.
   4.710 +
   4.711 +  <dt>table-column
   4.712 +  <dd>
   4.713 +    <p>All children are ignored (as if their <span
   4.714 +    class=property>'display-role'</span> was <span class=css>'none'</span>)
   4.715 +    See the section <a href="#columns">Columns</a> below for the
   4.716 +    function of properties on this element.
   4.717 +</dl>
   4.718 +
   4.719 +<p>See <a href="#width-layout">Table width algorithms</a> and <a
   4.720 +href="#height-layout">Table height algorithms</a> for the size of the
   4.721 +various elements.
   4.722 +
   4.723 +<p>Where it says “top to bottom” or “left to
   4.724 +right” in the definitions above, this should be replaced by the
   4.725 +appropriate direction based on the value of <span
   4.726 +class=property>'writing-mode'</span> of the enclosing <span
   4.727 +class=css>'table'</span> element, as follows. (Note that the writing
   4.728 +mode of other elements in the table may influence the direction of the
   4.729 +context of the table cells, but only the writing mode of the table
   4.730 +element itself determines the direction of the rows and columns.)
   4.731 +
   4.732 +<dl>
   4.733 +  <dt>lr-tb <dd>Rows are stacked top to bottom and columns are laid
   4.734 +  out from left to right (i.e., as in the definitions above).
   4.735 +
   4.736 +  <dt>rl-tb <dd>Rows are stacked top to bottom and columns are laid
   4.737 +  out right to left.
   4.738 +
   4.739 +  <dt>tb-rl <dd>Rows are laid out from right to left and columns from
   4.740 +  top to bottom.
   4.741 +
   4.742 +  <dt>tb-lr <dd>Rows are laid out from left to right and columns from
   4.743 +  top to bottom.
   4.744 +</dl>
   4.745 +
   4.746 +<p class=note>Note that there are theoretically 8 ways that rows and
   4.747 +columns can be ordered, but only the above 4 are supported.
   4.748 +
   4.749 +<p>The values of <span class=property>'table-role'</span> have the
   4.750 +following meaning
   4.751 +
   4.752 +<dl>
   4.753 +  <dt>table-cell
   4.754 +  <dd>
   4.755 +    <p>The element is a cell in a table row. If the parent, anonymous
   4.756 +    or not, doesn't have the model <span class=css>'table-row'</span>,
   4.757 +    an anonymous element is wrapped around this element and all its
   4.758 +    sister elements with the same role that form an uninterupted
   4.759 +    sequence. The anonymous element has a role and a model of <span
   4.760 +    class=css>'table-row'</span>.
   4.761 +
   4.762 +  <dt>table-caption
   4.763 +  <dd>
   4.764 +    <p>The element is the caption of a table. If the parent, anonymous
   4.765 +    or not, has a model other than <span class=css>'table'</span>, an
   4.766 +    anonymous element is wrapped around this element and any sisters
   4.767 +    with a role of 'table-{row,header,footer}-group', 'table-row',
   4.768 +    'table-column-group' or 'table-column' that form an uninterrupted
   4.769 +    sequence. The anonymous element has a role of <span
   4.770 +    class=css>'block'</span> and a model of <span
   4.771 +    class=css>'table'</span>.
   4.772 +
   4.773 +    <p>If the <span class=css>'table'</span> element that is this
   4.774 +    element's parent has another child with role <span
   4.775 +    class=css>'table-caption'</span> earlier in the document, this
   4.776 +    element is treated as if it had a role of <span
   4.777 +    class=css>'block'</span> instead. <span class=issue>[In
   4.778 +    CSS&nbsp;2.1 we said this situation was undefined and authors
   4.779 +    should not use it...]</span>
   4.780 +
   4.781 +  <dt>table-row-group
   4.782 +  <dd>
   4.783 +    <p>The element is a group of rows. If the parent, anonymous or
   4.784 +    not, has a model other than <span class=css>'table'</span>, an
   4.785 +    anonymous element is wrapped around this element and all its
   4.786 +    sister elements with a role of <span
   4.787 +    class=css>table-{row,header,footer}-group'</span> that form an
   4.788 +    uninterupted sequence. The anonymous element has a role of <span
   4.789 +    class=css>'block'</span> and a model of <span
   4.790 +    class=css>'table'</span>.
   4.791 +
   4.792 +  <dt id="table-header-group">table-header-group
   4.793 +  <dd>
   4.794 +    <p>The element is a group of rows that is displayed at the top of
   4.795 +    the table, after any top caption. In paged media, if a page break
   4.796 +    occurs in the table, the header group is repeated at the top of
   4.797 +    the table after every page break.
   4.798 +
   4.799 +    <p>If the parent, anonymous or not, has a model other than <span
   4.800 +    class=css>'table'</span>, an anonymous element is wrapped around
   4.801 +    this element and all its sister elements with a role of <span
   4.802 +    class=css>table-{row,header,footer}-group'</span> that form an
   4.803 +    uninterupted sequence. The anonymous element has a role of <span
   4.804 +    class=css>'block'</span> and a model of <span
   4.805 +    class=css>'table'</span>.
   4.806 +
   4.807 +  <dt>table-footer-group
   4.808 +  <dd>
   4.809 +    <p>The element is a group of rows that is displayed at the bottom
   4.810 +    of the table, before any bottom caption. In paged media, if a page
   4.811 +    break occurs in the table, the footer group is repeated at the
   4.812 +    bottom of the table before every page break.
   4.813 +
   4.814 +    <p>If the parent, anonymous or not, has a model other than <span
   4.815 +    class=css>'table'</span>, an anonymous element is wrapped around
   4.816 +    this element and all its sister elements with a role of <span
   4.817 +    class=css>table-{row,header,footer}-group'</span> that form an
   4.818 +    uninterupted sequence. The anonymous element has a role of <span
   4.819 +    class=css>'block'</span> and a model of <span
   4.820 +    class=css>'table'</span>.
   4.821 +
   4.822 +  <dt>table-column
   4.823 +  <dd>
   4.824 +    <p>The element creates a column. It's contents are ignored.
   4.825 +
   4.826 +    <p>If the parent, anonymous or not, has neither the model <span
   4.827 +    class=css>'table'</span> nor <span
   4.828 +    class=css>'table-column-group'</span>, an anonymous element is
   4.829 +wrapped around this element and any sisters with a role of 
   4.830 +<dd>
   4.831 +
   4.832 +</dl>
   4.833 +</div>
   4.834 +
   4.835 +<p class="issue">An <a
   4.836 +href="http://lists.w3.org/Archives/Public/www-style/2002Mar/0023.html">
   4.837 +idea</a> by Dorothea Salo of Open eBook Forum: some way to scroll a
   4.838 +table and keep the headers and footers on screen, plus a a vertical
   4.839 +analogue. Such "header columns" would stay on the screen during
   4.840 +horizontal scrolling.
   4.841 +
   4.842 +<div class=example>
   4.843 +<p>The <a href="http://www.w3.org/TR/CSS2/sample.html">default style sheet for HTML&nbsp;4.0</a>
   4.844 +in the appendix illustrates the use of these values for HTML&nbsp;4.0:
   4.845 +
   4.846 +<pre>
   4.847 +table    { display: table }
   4.848 +tr       { display: table-row }
   4.849 +thead    { display: table-header-group }
   4.850 +tbody    { display: table-row-group }
   4.851 +tfoot    { display: table-footer-group }
   4.852 +col      { display: table-column }
   4.853 +colgroup { display: table-column-group }
   4.854 +td, th   { display: table-cell }
   4.855 +caption  { display: table-caption }
   4.856 +</pre>
   4.857 +</div>
   4.858 +
   4.859 +<p>User agents may ignore these
   4.860 +'display' property values for
   4.861 +HTML table elements, since HTML tables may be rendered using other
   4.862 +algorithms intended for backwards compatible rendering. However, this
   4.863 +is not meant to discourage the use of 'display: table' on other,
   4.864 +non-table elements in HTML.
   4.865 +
   4.866 +<p class=issue>Remove the above paragraph?
   4.867 +
   4.868 +<h3 id="anonymous-boxes">Anonymous table objects</h3>
   4.869 +
   4.870 +<p>Document languages other than HTML may not contain all the elements
   4.871 +in the CSS&nbsp;2.1 table model. In these cases, the “missing”
   4.872 +elements must be assumed in order for the table model to work. Any
   4.873 +table element will automatically generate necessary anonymous table
   4.874 +objects around itself, consisting of at least three nested objects
   4.875 +corresponding to a 'table'/'inline-table' element, a 'table-row'
   4.876 +element, and a 'table-cell' element. Missing elements generate
   4.877 +<em>anonymous</em> objects (e.g., anonymous
   4.878 +boxes in visual table layout) according to the following rules:
   4.879 +
   4.880 +<ol>
   4.881 +  <li>If the parent P of a ''table-cell'' box T is not a
   4.882 +  ''table-row'', a box corresponding to a ''table-row'' will be
   4.883 +  generated between P and T. This box will span all consecutive
   4.884 +  'table-cell' sibling boxes of T.
   4.885 +
   4.886 +  <li>If the parent P of a ''table-row'' box T is not a ''table'',
   4.887 +  ''inline-table'', ''table-header-group'', ''table-footer-group'' or
   4.888 +  ''table-row-group'' box, a box corresponding to a ''table''
   4.889 +  element will be generated between P and T.
   4.890 +  If P is an ''inline'' box, then the generated box must be an
   4.891 +  ''inline-table'' box instead of a ''table'' box.
   4.892 +  This box will span all
   4.893 +  consecutive sibling boxes of T that require a
   4.894 +  ''table'' parent: ''table-row'', ''table-row-group'',
   4.895 +  ''table-header-group'', ''table-footer-group'', ''table-column'',
   4.896 +  ''table-column-group'', and ''table-caption''. T and T's siblings may
   4.897 +  also be anonymous ''table-row'' boxes generated by rule&nbsp;1.
   4.898 +
   4.899 +  <li>If the parent P of a ''table-column'' box T is not a ''table'',
   4.900 +  ''inline-table'', or ''table-column-group'' box, a box
   4.901 +  corresponding to a ''table'' element will be generated between P and
   4.902 +  T.
   4.903 +  If P is an ''inline'' box, then the generated box must be an
   4.904 +  ''inline-table'' box instead of a ''table'' box.
   4.905 +  This box will span all consecutive sibling boxes
   4.906 +  of T that require a ''table'' parent: ''table-row'',
   4.907 +  ''table-row-group'', ''table-header-group'', ''table-footer-group'',
   4.908 +  ''table-column'', ''table-column-group'', and ''table-caption'', including
   4.909 +  any anonymous ''table-row'' boxes generated by rule&nbsp;1.
   4.910 +
   4.911 +  <li>If the parent P of a ''table-row-group'' (or ''table-header-group'',
   4.912 +  ''table-footer-group'', or ''table-column-group'' or ''table-caption'')
   4.913 +  box T is not a ''table'' or ''inline-table'', a box
   4.914 +  corresponding to a ''table'' element will be generated between P and
   4.915 +  T.
   4.916 +  If P is an ''inline'' box, then the generated box must be an
   4.917 +  ''inline-table'' box instead of a ''table'' box.
   4.918 +  This box will span all consecutive sibling boxess
   4.919 +  of T that require a ''table'' parent: ''table-row'',
   4.920 +  ''table-row-group'', ''table-header-group'', ''table-footer-group'',
   4.921 +  ''table-column'', ''table-column-group'', and ''table-caption'', including
   4.922 +  any anonymous ''table-row'' boxes generated by rule&nbsp;1.
   4.923 +
   4.924 +  <li>If a child T of a ''table'' box (or ''inline-table'') P is not a
   4.925 +  ''table-row-group'', ''table-header-group'', ''table-footer-group'',
   4.926 +  ''table-caption'', ''table-column'', ''table-column-group'' or ''table-row''
   4.927 +  box, a box corresponding to a ''table-row'' element will be
   4.928 +  generated between P and T. This box spans all consecutive
   4.929 +  siblings of T that are not ''table-row-group'', ''table-header-group'',
   4.930 +  ''table-footer-group'', ''table-caption'', ''table-column'',
   4.931 +  ''table-column-group'' or ''table-row'' boxes.
   4.932 +
   4.933 +  <li>If a child T of a ''table-row-group'' box (or
   4.934 +  ''table-header-group'' or ''table-footer-group'') P is not a ''table-row''
   4.935 +  box, a box corresponding to a ''table-row'' element will be
   4.936 +  generated between P and T. This box spans all consecutive
   4.937 +  siblings of T that are not ''table-row'' boxes.
   4.938 +
   4.939 +  <li>If a child T of a ''table-row'' box P is not a ''table-cell''
   4.940 +  box, a box corresponding to a ''table-cell'' element will be
   4.941 +  generated between P and T. This box spans all consecutive
   4.942 +  siblings of T that are not ''table-cell'' boxes.
   4.943 +</ol>
   4.944 +
   4.945 +<div class="example">
   4.946 +<p>In this XML example, a ''table'' element is assumed to contain the
   4.947 +HBOX element:
   4.948 +
   4.949 +<pre>
   4.950 +&lt;HBOX&gt;
   4.951 +  &lt;VBOX&gt;George&lt;/VBOX&gt;
   4.952 +  &lt;VBOX&gt;4287&lt;/VBOX&gt;
   4.953 +  &lt;VBOX&gt;1998&lt;/VBOX&gt;
   4.954 +&lt;/HBOX&gt;
   4.955 +</pre>
   4.956 +
   4.957 +<p>because the associated style sheet is:
   4.958 +
   4.959 +<pre>
   4.960 +HBOX { display: table-row }
   4.961 +VBOX { display: table-cell }
   4.962 +</pre>
   4.963 +</div>
   4.964 +
   4.965 +<div class="example">
   4.966 +<p>In this example, three ''table-cell'' elements are assumed to contain
   4.967 +the text in the ROWs. Note that the text is further encapsulated in
   4.968 +anonymous inline boxes, as explained in <span
   4.969 +class="issue">[where?]</span>:
   4.970 +
   4.971 +<pre class="xml-example">
   4.972 +&lt;STACK&gt;
   4.973 +  &lt;ROW&gt;This is the &lt;D&gt;top&lt;/D&gt; row.&lt;/ROW&gt;
   4.974 +  &lt;ROW&gt;This is the &lt;D&gt;middle&lt;/D&gt; row.&lt;/ROW&gt;
   4.975 +  &lt;ROW&gt;This is the &lt;D&gt;bottom&lt;/D&gt; row.&lt;/ROW&gt;
   4.976 +&lt;/STACK&gt;
   4.977 +</pre>
   4.978 +
   4.979 +<p>The style sheet is:
   4.980 +
   4.981 +<pre>
   4.982 +STACK { display: inline-table }
   4.983 +ROW   { display: table-row }
   4.984 +D     { display: inline; font-weight: bolder }
   4.985 +</pre>
   4.986 +</div>
   4.987 +
   4.988 +<h2 id=columns>Columns</h2>
   4.989 +
   4.990 +<p>Table cells may belong to two contexts: rows and columns. However,
   4.991 +in the source document cells are descendants of rows, never of
   4.992 +columns. Nevertheless, some aspects of cells can be influenced by
   4.993 +setting properties on columns.
   4.994 +
   4.995 +<p>The following properties apply to column and column-group elements:
   4.996 +
   4.997 +<dl>
   4.998 +  <dt>'border'
   4.999 +
  4.1000 +    <dd>The various border properties apply to columns only if
  4.1001 +    'border-collapse' is set
  4.1002 +    to ''collapse'' on the table element. In that case, borders set on
  4.1003 +    columns and column groups are input to the <a
  4.1004 +    href="#border-conflict-resolution">conflict resolution
  4.1005 +    algorithm</a> that selects the border styles at every cell edge.
  4.1006 +
  4.1007 +  <dt>'background'
  4.1008 +
  4.1009 +    <dd>The background properties set the background for cells in the
  4.1010 +    column, but only if both the cell and row have transparent
  4.1011 +    backgrounds. See <a href="#table-layers">“Table layers and
  4.1012 +    transparency.”</a>
  4.1013 +
  4.1014 +  <dt>'width'
  4.1015 +
  4.1016 +    <dd>The 'width' property gives
  4.1017 +    the minimum width for the column.
  4.1018 +
  4.1019 +  <dt>'visibility'
  4.1020 +
  4.1021 +    <dd>If the 'visibility' of a column is set to ''collapse'', none of
  4.1022 +    the cells in the column are rendered, and cells that span into
  4.1023 +    other columns are clipped. In addition, the width of the table is
  4.1024 +    diminished by the width the column would have taken up. See <a
  4.1025 +    href="#dynamic-effects">“Dynamic effects”</a> below. Other values
  4.1026 +    for 'visibility' have no effect.
  4.1027 +</dl>
  4.1028 +
  4.1029 +<div class="example">
  4.1030 +<p>Here are some examples of style rules that set properties on
  4.1031 +columns. The first two rules together implement the "rules" attribute
  4.1032 +of HTML 4 with a value of "cols". The third rule makes the "totals"
  4.1033 +column blue, the final two rules shows how to make a column a fixed
  4.1034 +size, by using the <a href="#fixed-table-layout">fixed layout
  4.1035 +algorithm</a>.
  4.1036 +
  4.1037 +<pre>
  4.1038 +col { border-style: none solid }
  4.1039 +table { border-style: hidden }
  4.1040 +col.totals { background: blue }
  4.1041 +table { table-layout: fixed }
  4.1042 +col.totals { width: 5em }
  4.1043 +</pre>
  4.1044 +</div>
  4.1045 +
  4.1046 +<h2 id=model>Tables in the visual formatting model</h2>
  4.1047 +
  4.1048 +<p>In terms of the visual formatting model ([[!CSS3BOX]]), a table can
  4.1049 +behave like a <em>block-level</em> (for 'display:
  4.1050 +table') or <em>inline-level</em> (for
  4.1051 +'display: inline-table') element.
  4.1052 +
  4.1053 +<p>In both cases, the table box generates an anonymous box that
  4.1054 +contains the table box itself and any caption boxes (in document
  4.1055 +order), except those with 'caption-side' set to ''top-outside'' or
  4.1056 +''bottom-outside''. The caption boxes are block-level boxes that
  4.1057 +retain their own
  4.1058 +content, padding, margin, and border areas, and are rendered as normal
  4.1059 +blocks inside the anonymous box. Whether the caption boxes are placed
  4.1060 +before or after the table box is decided by the 'caption-side'
  4.1061 +property, as described below.
  4.1062 +
  4.1063 +<p>The anonymous box is a ''block'' box if the table is block-level, and
  4.1064 +an ''inline-block'' box if the table is inline-level, except that this
  4.1065 +block is never considered as a block for ''run-in'' interaction, and
  4.1066 +that the table box (not the anonymous box) is used when doing baseline
  4.1067 +vertical alignment for an ''inline-table''. The width of the anonymous
  4.1068 +box is the border-edge width of the table box inside it, as described
  4.1069 +by <a href="#width-layout">section [??]</a>. Percentages on 'width' on
  4.1070 +the table are relative to
  4.1071 +the anonymous box's containing block, not the anonymous box itself.
  4.1072 +
  4.1073 +<p>The computed values of properties 'position', 'float', 'margin-*',
  4.1074 +'top', 'right', 'bottom', and 'left' on the table box are used on the
  4.1075 +anonymous box instead of the table box. The table box uses the initial
  4.1076 +values for those properties.
  4.1077 +
  4.1078 +<div class="figure">
  4.1079 +<p><img src="top-caption.png" alt="A table with a caption above
  4.1080 +it">
  4.1081 +
  4.1082 +<p class="caption">Diagram of a table with a caption above it; the
  4.1083 +top margin of the caption is collapsed with the top margin of the
  4.1084 +table.
  4.1085 +</div>
  4.1086 +
  4.1087 +<h3>Caption position and alignment</h3>
  4.1088 +
  4.1089 +<table class=propdef>
  4.1090 +    <tr>
  4.1091 +      <td><em>Name:</em>
  4.1092 +      <td><dfn>caption-side</dfn>
  4.1093 +    <tr>
  4.1094 +      <td><em>Value:</em>
  4.1095 +      <td>[ top | bottom | left | right | before | after ] && outside?
  4.1096 +    <tr>
  4.1097 +      <td><em>Initial:</em>
  4.1098 +      <td>top
  4.1099 +    <tr>
  4.1100 +      <td><em>Applies to:</em>
  4.1101 +      <td>'table-caption' elements
  4.1102 +    <tr>
  4.1103 +      <td><em>Inherited:</em>
  4.1104 +      <td>yes
  4.1105 +    <tr>
  4.1106 +      <td><em>Percentages:</em>
  4.1107 +      <td>N/A
  4.1108 +    <tr>
  4.1109 +      <td><em>Media:</em>
  4.1110 +      <td>visual
  4.1111 +    <tr>
  4.1112 +      <td><em>Computed&nbsp;value:</em>
  4.1113 +      <td>specified value
  4.1114 +</table>
  4.1115 +
  4.1116 +<p>This property specifies the position of the caption box with
  4.1117 +respect to the table box. Values have the following meanings:
  4.1118 +
  4.1119 +<dl>
  4.1120 +  <dt><dfn title="top (caption-side)">top</dfn> <dd>Positions the
  4.1121 +  caption box above the table box.
  4.1122 +
  4.1123 +  <dt><dfn title="bottom (caption-side)">bottom</dfn> <dd>Positions
  4.1124 +  the caption box below the table box.
  4.1125 +
  4.1126 +  <dt><dfn title="left (caption-side)">left</dfn> <dd>Positions the
  4.1127 +  caption box to the left of the table box.
  4.1128 +
  4.1129 +  <dt><dfn title="right (caption-side)">right</dfn> <dd>Positions the
  4.1130 +  caption box to the right of the table box.
  4.1131 +
  4.1132 +  <dt><dfn title="before (caption-side)">before</dfn>
  4.1133 +  <dd>The used value depends on the value of the element's 'writing-mode':
  4.1134 +  <table class=equiv-table>
  4.1135 +  <thead>
  4.1136 +  <tr><th>Value of 'writing-mode' <th>Meaning of ''before''
  4.1137 +  <tbody>
  4.1138 +  <tr><th>''horizontal-tb'' <td>''top''
  4.1139 +  <tr><th>''vertical-rl'' <td>''right''
  4.1140 +  <tr><th>''vertical-lr'' <td>''left''
  4.1141 +  </table>
  4.1142 +
  4.1143 +  <dt><dfn title="after (caption-side)">after</dfn> <dd>The used value
  4.1144 +  depends on the value of the element's 'writing-mode':
  4.1145 +  <table class=equiv-table>
  4.1146 +  <thead>
  4.1147 +  <tr><th>Value of 'writing-mode' <th>Meaning of ''after''
  4.1148 +  <tbody>
  4.1149 +  <tr><th>''horizontal-tb'' <td>''bottom''
  4.1150 +  <tr><th>''vertical-rl'' <td>''left''
  4.1151 +  <tr><th>''vertical-lr'' <td>''right''
  4.1152 +  </table>
  4.1153 +</dl>
  4.1154 +
  4.1155 +<p>Captions with the extra keyword ''outside'' are formatted
  4.1156 +very much as if they were a block element before or after the table,
  4.1157 +except that (1) they inherit inheritable properties from the table,
  4.1158 +and (2) they are not considered to be a block box for the purposes of
  4.1159 +any ''compact'' or ''run-in'' element that may precede the table.
  4.1160 +
  4.1161 +<p>Such a caption also behaves like a block box for width and height
  4.1162 +calculations; the width and height are calculated with respect to the
  4.1163 +table box's containing block.
  4.1164 +
  4.1165 +<p>For a caption that is on the left or right side of a table box, on
  4.1166 +the other hand, a value other than ''auto'' for 'width' sets the width
  4.1167 +explicitly, but ''auto''
  4.1168 +tells the user agent to chose a “reasonable width.” This
  4.1169 +may vary between “the narrowest possible box” to “a
  4.1170 +single line,” so we recommend that users do not specify ''auto''
  4.1171 +for left and right caption widths.
  4.1172 +
  4.1173 +<p>To align caption content horizontally within the caption box, use
  4.1174 +the 'text-align' property.
  4.1175 +
  4.1176 +<p>For vertical alignment of a left or right caption box with respect
  4.1177 +to the table box, use the 'vertical-align' property. The only meaningful
  4.1178 +values in this case are ''top'', ''middle'', and ''bottom''. All other
  4.1179 +values are treated the same as ''top''.
  4.1180 +
  4.1181 +<p>All left captions are displayed side by side (left margin edge of
  4.1182 +the first against right margin edge of the next, etc.).
  4.1183 +
  4.1184 +<div class="example">
  4.1185 +<p>In this example, the 'caption-side' property places
  4.1186 +captions below tables.  The caption will be as wide as the parent of
  4.1187 +the table, and caption text will be left-justified.
  4.1188 +
  4.1189 +<pre>
  4.1190 +caption { caption-side: bottom; 
  4.1191 +          width: auto;
  4.1192 +          text-align: left }
  4.1193 +</pre>
  4.1194 +</div>
  4.1195 +
  4.1196 +<div class="example">
  4.1197 +<p>The following example shows how to put a caption in the left
  4.1198 +margin. The table itself is centered, by setting its left and right
  4.1199 +margins to 'auto', and the whole box with table and caption is shifted
  4.1200 +into the left margin by the same amount as the width of the caption.
  4.1201 +
  4.1202 +<pre>
  4.1203 +body {
  4.1204 +    margin-left: 8em }
  4.1205 +table {
  4.1206 +    margin-left: auto;
  4.1207 +    margin-right: auto }
  4.1208 +caption {
  4.1209 +    caption-side: left;
  4.1210 +    margin-left: -8em;
  4.1211 +    width: 8em;
  4.1212 +    text-align: right;
  4.1213 +    vertical-align: bottom }
  4.1214 +</pre>
  4.1215 +
  4.1216 +<p>Assuming the width of the table is less than the available width, the
  4.1217 +formatting will be similar to this:
  4.1218 +
  4.1219 +<div class="figure">
  4.1220 +<p><img src="left-caption"
  4.1221 +alt="A centered table with a caption in the left margin of the page">
  4.1222 +
  4.1223 +<p class="caption">Diagram showing a centered table with the caption
  4.1224 +extending into the left margin, as a result of a negative 'margin-left'
  4.1225 +property.
  4.1226 +</div><!-- figure -->
  4.1227 +</div><!-- example -->
  4.1228 +
  4.1229 +<h2 id="Visual">Visual layout of table contents</h2>
  4.1230 +
  4.1231 +<p>Internal table elements generate rectangular
  4.1232 +boxes with content and borders.
  4.1233 +Cells have padding as well. Internal table elements do not have
  4.1234 +margins.
  4.1235 +
  4.1236 +<p>The visual layout of these boxes is governed by a rectangular,
  4.1237 +irregular grid of rows and columns. Each box occupies a whole number
  4.1238 +of grid cells, determined according to the following rules. These
  4.1239 +rules do not apply to HTML 4 or earlier HTML versions; HTML imposes
  4.1240 +its own limitations on row and column spans.
  4.1241 +
  4.1242 +<ol>
  4.1243 +  <li>Each row box occupies one row of grid cells. Together, the row
  4.1244 +  boxes fill the table from top to bottom in the order they occur in
  4.1245 +  the source document (i.e., the table occupies exactly as many grid
  4.1246 +  rows as there are row elements).
  4.1247 +
  4.1248 +  <li>A row group occupies the same grid cells as the rows it
  4.1249 +  contains.
  4.1250 +
  4.1251 +  <li>A column box occupies one or more columns of grid cells. Column
  4.1252 +  boxes are placed next to each other in the order they occur. The
  4.1253 +  first column box may be either on the left or on the right,
  4.1254 +  depending on the value of the 'direction' property of the table.
  4.1255 +
  4.1256 +  <li>A column group box occupies the same grid cells as the columns
  4.1257 +  it contains.
  4.1258 +
  4.1259 +  <li>Cells may span several rows or columns. (See 'row-span'.) Each
  4.1260 +  cell is thus a rectangular box, one
  4.1261 +  or more grid cells wide and high. The top row of this rectangle is
  4.1262 +  in the row specified by the cell's parent. The rectangle must be as
  4.1263 +  far to the left as possible, but it may not overlap with any other
  4.1264 +  cell box, and must be to the right of all cells in the same row that
  4.1265 +  are earlier in the source document. (This constraint holds if the
  4.1266 +  'direction' property of the table is 'ltr'; if the 'direction' is
  4.1267 +  'rtl', interchange“left” and “right” in the previous sentence.)
  4.1268 +
  4.1269 +  <li>A cell box cannot extend beyond the last row box of a table or
  4.1270 +  row-group; the user agents must shorten it until it fits.
  4.1271 +</ol>
  4.1272 +
  4.1273 +<p>The edges of the rows, columns, row groups and column groups in the
  4.1274 +<a href="#collapsing-borders">collapsing borders model</a> coincide
  4.1275 +with the hypothetical grid lines on which the borders of the cells are
  4.1276 +centered. (And thus, in this model, the rows together exactly cover
  4.1277 +the table, leaving no gaps; ditto for the columns.) In the <a
  4.1278 +href="#separated-borders">separated borders model,</a> the edges
  4.1279 +coincide with the <em title="border edge">border edges</em> of
  4.1280 +cells. (And thus, in this model, there may be gaps between the rows,
  4.1281 +columns, row groups or column groups, corresponding to the
  4.1282 +'border-spacing' property.)
  4.1283 +
  4.1284 +<div class="note">
  4.1285 +<p><strong>Note.</strong> Positioning and floating of table cells
  4.1286 +can cause them not to be table cells anymore, according to the rules
  4.1287 +in <a href="??">[Relationships between 'display', 'position', and
  4.1288 +'float']</a>. When floating is used, the rules on <a
  4.1289 +href="#anonymous-boxes">anonymous table objects</a> may cause an
  4.1290 +anonymous cell object to be created as well.
  4.1291 +</div>
  4.1292 +
  4.1293 +<div class="html-example">
  4.1294 +<p>Here are two examples. The first is assumed to occur in an HTML
  4.1295 +document, the second an XHTML document:
  4.1296 +
  4.1297 +<pre>
  4.1298 +&lt;TABLE&gt;
  4.1299 +&lt;TR&gt;&lt;TD&gt;1 &lt;TD rowspan="2"&gt;2 &lt;TD&gt;3 &lt;TD&gt;4
  4.1300 +&lt;TR&gt;&lt;TD colspan="2"&gt;5
  4.1301 +&lt;/TABLE&gt;
  4.1302 +</pre>
  4.1303 +
  4.1304 +<pre>
  4.1305 +&lt;table&gt;
  4.1306 +&lt;tr&gt;&lt;td&gt;1 &lt;/td&gt;&lt;td rowspan="2"&gt;2 &lt;/td&gt;&lt;td&gt;3 &lt;/td&gt;&lt;td&gt;4 &lt;/td&gt;&lt;/tr&gt;
  4.1307 +&lt;tr&gt;&lt;td colspan="2"&gt;5 &lt;/td&gt;&lt;/tr&gt;
  4.1308 +&lt;/table&gt;
  4.1309 +</pre>
  4.1310 +
  4.1311 +<p>The second is formatted as in the figure on the right. However, the
  4.1312 +HTML table's rendering is explicitly undefined by HTML, and CSS
  4.1313 +doesn't try to define it. User agents are free to render it, e.g., as
  4.1314 +in the figure on the left.
  4.1315 +
  4.1316 +<div class="figure">
  4.1317 +<p><img src="table-overlap" alt="One table with overlapping cells and
  4.1318 +one without">
  4.1319 +
  4.1320 +<p class="caption">On the left, one possible rendering of an erroneous
  4.1321 +HTML&nbsp;4 table; on the right, the only possible formatting of a
  4.1322 +similar XHTML table.
  4.1323 +</div>
  4.1324 +</div>
  4.1325 +
  4.1326 +<h3 id="table-layers">Table layers and transparency</h3>
  4.1327 +
  4.1328 +<p>For the purposes of finding the background of each table cell, the
  4.1329 +different table elements may be thought of as being on six
  4.1330 +superimposed layers. The background set on an element in one of the
  4.1331 +layers will only be visible if the layers above it have a transparent
  4.1332 +background.
  4.1333 +
  4.1334 +<div class="figure">
  4.1335 +<p><img src="tbl-layers.png" alt="schema of table layers">
  4.1336 +
  4.1337 +<p class="caption">Schema of table layers.
  4.1338 +</div>
  4.1339 +
  4.1340 +<ol>
  4.1341 +  <li>The lowest layer is a single plane, representing the table box
  4.1342 +  itself. Like all boxes, it may be transparent.
  4.1343 +
  4.1344 +  <li>The next layer contains the column groups. Each column group
  4.1345 +  extends from the top of the cells in the top row to the bottom of
  4.1346 +  the cells on the bottom row and from the left edge of its leftmost
  4.1347 +  column to the right edge of its rightmost column. The background
  4.1348 +  extends to cover the full area of all cells that originate in the
  4.1349 +  column group, but this extension does not affect background image
  4.1350 +  positioning.
  4.1351 +
  4.1352 +  <li>On top of the column groups are the areas representing the
  4.1353 +  column boxes. Each column is as tall as the column groups and as
  4.1354 +  wide as a normal (single-column-spanning) cell in the column. The
  4.1355 +  background extends to cover the full area of all cells that
  4.1356 +  originate in the column, even if they span outside the column, but
  4.1357 +  this extension does not affect background image positioning.
  4.1358 +
  4.1359 +  <li>Next is the layer containing the row groups. Each row group
  4.1360 +  extends from the top left corner of its topmost cell in the first
  4.1361 +  column to the bottom right corner of its bottommost cell in the last
  4.1362 +  column.
  4.1363 +
  4.1364 +  <li>The next to last layer contains the rows. Each row is as wide as
  4.1365 +  the row groups and as tall as a normal (single-row-spanning) cell in
  4.1366 +  the row. As with columns, the background extends to cover the full
  4.1367 +  area of all cells that originate in the row, even if they span
  4.1368 +  outside the row, but this extension does not affect background
  4.1369 +  image positioning.
  4.1370 +
  4.1371 +  <li>The topmost layer contains the cells themselves. As the figure
  4.1372 +  shows, although all rows contain the same number of cells, not every
  4.1373 +  cell may have specified content. If the value of their
  4.1374 +  'empty-cells' property is 'hide'
  4.1375 +  these “empty” cells are transparent through the cell, row, row
  4.1376 +  group, column and column group backgrounds, letting the table
  4.1377 +  background show through.
  4.1378 +</ol>
  4.1379 +
  4.1380 +<div class="html-example">
  4.1381 +<p>In the following example, the first row contains four cells, but
  4.1382 +the second row contains no cells, and thus the table background shines
  4.1383 +through, except where a cell from the first row spans into this row.
  4.1384 +The following HTML code and style rules.
  4.1385 +
  4.1386 +<pre>
  4.1387 +&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"&gt;
  4.1388 +&lt;HTML&gt;
  4.1389 +  &lt;HEAD&gt;
  4.1390 +    &lt;TITLE&gt;Table example&lt;/TITLE&gt;
  4.1391 +    &lt;STYLE type="text/css"&gt;
  4.1392 +      TABLE { background: #ff0; border-collapse: collapse;
  4.1393 +              empty-cells: hide }
  4.1394 +      TD    { background: red; border: double black }
  4.1395 +    &lt;/STYLE&gt;
  4.1396 +  &lt;/HEAD&gt;
  4.1397 +  &lt;BODY&gt;
  4.1398 +    &lt;TABLE&gt;
  4.1399 +      &lt;TR&gt;
  4.1400 +        &lt;TD&gt; 1 
  4.1401 +        &lt;TD rowspan="2"&gt; 2
  4.1402 +        &lt;TD&gt; 3 
  4.1403 +        &lt;TD&gt; 4 
  4.1404 +      &lt;/TR&gt;
  4.1405 +      &lt;TR&gt;&lt;TD&gt;&lt;/TD&gt;&lt;/TR&gt;
  4.1406 +    &lt;/TABLE&gt; 
  4.1407 +  &lt;/BODY&gt;
  4.1408 +&lt;/HTML&gt;
  4.1409 +</pre>
  4.1410 +
  4.1411 +<p>might be formatted as follows:
  4.1412 +
  4.1413 +<div class="figure">
  4.1414 +  <p><img src="tbl-empty.png" alt="Table with three empty cells in
  4.1415 +  bottom row">
  4.1416 +
  4.1417 +  <p class="caption">Table with three empty cells in the bottom row.
  4.1418 +</div>
  4.1419 +</div>
  4.1420 +
  4.1421 +<p>Note that if the table has 'border-collapse: separate', the
  4.1422 +background of the area given by the
  4.1423 +'border-spacing' property is
  4.1424 +always the background of the table element. See <a
  4.1425 +href="#separated-borders">the separated borders model</a>.
  4.1426 +
  4.1427 +<h3 id="width-layout">Table width algorithms: the 'table-layout'
  4.1428 +property</h3>
  4.1429 +
  4.1430 +<p>CSS does not define an “optimal” layout for tables
  4.1431 +since, in many cases, what is optimal is a matter of taste. CSS does
  4.1432 +define constraints that user agents must respect when laying out a
  4.1433 +table. User agents may use any algorithm they wish to do so, and are
  4.1434 +free to prefer rendering speed over precision, except when the
  4.1435 +“fixed layout algorithm” is selected.
  4.1436 +
  4.1437 +<p>Note that this section overrides the rules that apply to
  4.1438 +calculating widths as described in [[!CSS3BOX]]. In
  4.1439 +particular, if the margins of a table are set to '0' and the width to
  4.1440 +''auto'', the table will not automatically size to fill its containing
  4.1441 +block. However, once the calculated value of 'width' for the table is
  4.1442 +found (using the algorithms given below or, when appropriate, some
  4.1443 +other UA dependent algorithm) then the other parts of the algorithm do
  4.1444 +apply. Therefore a table <em>can</em> be centered using left and right
  4.1445 +''auto'' margins, for instance.
  4.1446 +
  4.1447 +<p>Future updates of CSS may introduce ways of making tables
  4.1448 +automatically fit their containing blocks.
  4.1449 +
  4.1450 +
  4.1451 +<table class=propdef>
  4.1452 +    <tr>
  4.1453 +      <td><em>Name:</em>
  4.1454 +      <td><dfn>table-layout</dfn>
  4.1455 +    <tr>
  4.1456 +      <td><em>Value:</em>
  4.1457 +      <td>auto | fixed
  4.1458 +    <tr>
  4.1459 +      <td><em>Initial:</em>
  4.1460 +      <td>auto
  4.1461 +    <tr>
  4.1462 +      <td><em>Applies to:</em>
  4.1463 +      <td>'table' and 'inline-table' elements
  4.1464 +    <tr>
  4.1465 +      <td><em>Inherited:</em>
  4.1466 +      <td>no
  4.1467 +    <tr>
  4.1468 +      <td><em>Percentages:</em>
  4.1469 +      <td>N/A
  4.1470 +    <tr>
  4.1471 +      <td><em>Media:</em>
  4.1472 +      <td>visual
  4.1473 +    <tr>
  4.1474 +      <td><em>Computed&nbsp;value:</em>
  4.1475 +      <td>specified value
  4.1476 +</table>
  4.1477 +
  4.1478 +<p>The 'table-layout'
  4.1479 +property controls the algorithm used to lay out the table cells, rows,
  4.1480 +and columns. Values have the following meaning:
  4.1481 +
  4.1482 +<dl>
  4.1483 +  <dt><dfn>fixed</dfn> <dd>Use the fixed table layout algorithm
  4.1484 +
  4.1485 +  <dt><dfn title="auto (table-layout)">auto</dfn> <dd>Use any
  4.1486 +  automatic table layout algorithm
  4.1487 +</dl>
  4.1488 +
  4.1489 +<p>The two algorithms are described below.
  4.1490 +
  4.1491 +<h4 id="fixed-table-layout">Fixed table layout</h4>
  4.1492 +
  4.1493 +<p>With this (fast) algorithm, the horizontal layout of the table does
  4.1494 +not depend on the contents of the cells; it only depends on the
  4.1495 +table's width, the width of the columns, and borders or cell spacing.
  4.1496 +
  4.1497 +<p>The table's width may be specified explicitly with the
  4.1498 +'width' property. A value of ''auto'' (for
  4.1499 +both 'display: table' and 'display: inline-table') means use the <a
  4.1500 +href="#auto-table-layout">automatic table layout</a> algorithm.
  4.1501 +However, if the table is a block-level table ('display: table') in
  4.1502 +normal flow, a UA may (but does not have to) use the algorithm of <a
  4.1503 +href="http://www.w3.org/TR/CSS2/visudet.html#q6">10.3.3</a> [Re-link this to the Box Model] to
  4.1504 +compute a width and apply fixed table layout even if the specified
  4.1505 +width is 'auto'.
  4.1506 +
  4.1507 +<div class="example">
  4.1508 +<p>If a UA supports fixed table layout when 'width' is 'auto', the
  4.1509 +following will create a table that is 4em narrower than its containing
  4.1510 +block:
  4.1511 +
  4.1512 +<pre>
  4.1513 +table { table-layout: fixed;
  4.1514 +        margin-left: 2em;
  4.1515 +        margin-right: 2em }
  4.1516 +</pre>
  4.1517 +</div>
  4.1518 +
  4.1519 +<p>In the fixed table layout algorithm, the width of each column is
  4.1520 +determined as follows:
  4.1521 +
  4.1522 +<ol>
  4.1523 +  <li>A column element with a value other than 'auto' for the
  4.1524 +  'width' property sets the width for
  4.1525 +  that column.
  4.1526 +
  4.1527 +  <li>Otherwise, a cell in the first row with a value other than
  4.1528 +  'auto' for the 'width' property
  4.1529 +  determines the width for that column. If the cell spans more than
  4.1530 +  one column, the width is divided over the columns.
  4.1531 +
  4.1532 +  <li>Any remaining columns equally divide the remaining horizontal
  4.1533 +  table space (minus borders or cell spacing).
  4.1534 +</ol>
  4.1535 +
  4.1536 +<p>The width of the table is then the greater of the value of the
  4.1537 +'width' property for the table
  4.1538 +element and the sum of the column widths (plus cell spacing or
  4.1539 +borders). If the table is wider than the columns, the extra space
  4.1540 +should be distributed over the columns.
  4.1541 +
  4.1542 +<p>If a subsequent row has more columns than the first, then
  4.1543 +additional columns must not be rendered. When using 'table-layout:
  4.1544 +fixed', authors should not omit columns from the first row.
  4.1545 +
  4.1546 +<p>In this manner, the user agent can begin to lay out the table once
  4.1547 +the entire first row has been received. Cells in subsequent rows do
  4.1548 +not affect column widths. Any cell that has content that overflows
  4.1549 +uses the 'overflow' property to
  4.1550 +determine whether to clip the overflow content.
  4.1551 +
  4.1552 +<h4 id="auto-table-layout">Automatic table layout</h4>
  4.1553 +
  4.1554 +<p>In this algorithm (which generally requires no more than two
  4.1555 +passes), the table's width is given by the width of its columns (and
  4.1556 +intervening <a href="#borders">borders</a>). This algorithm reflects
  4.1557 +the behavior of several popular HTML user agents at the writing of
  4.1558 +this specification. UAs are not required to implement this algorithm
  4.1559 +to determine the table layout in the case that <span
  4.1560 +class="propinst-table-layout">'table-layout'</span> is 'auto'; they
  4.1561 +can use any other algorithm even if it results in different behavior.
  4.1562 +
  4.1563 +<p>Input to the automatic table layout must only include the width of
  4.1564 +the containing block and the content of, and any CSS properties set
  4.1565 +on, the table and any of its descendants.
  4.1566 +
  4.1567 +<div class=issue>
  4.1568 +<p>This should be defined in more detail.
  4.1569 +</div>
  4.1570 +
  4.1571 +<p><em>The remainder of this section is non-normative.</em>
  4.1572 +
  4.1573 +<p>This algorithm may be inefficient since it requires the user agent
  4.1574 +to have access to all the content in the table before determining the
  4.1575 +final layout and may demand more than one pass.
  4.1576 +
  4.1577 +<p>Column widths are determined as follows:
  4.1578 +
  4.1579 +<ol>
  4.1580 +  <li><p>Calculate the minimum content width (MCW) of each cell: the
  4.1581 +  formatted content may span any number of lines but may not overflow
  4.1582 +  the cell box. If the specified
  4.1583 +  'width' (W) of the cell is greater
  4.1584 +  than MCW, W is the minimum cell width. A value of ''auto'' means that
  4.1585 +  MCW is the minimum cell width.
  4.1586 +
  4.1587 +  <p>Also, calculate the "maximum" cell width of each cell: formatting
  4.1588 +  the content without breaking lines other than where explicit line
  4.1589 +  breaks occur.
  4.1590 +
  4.1591 +  <li><p>For each column, determine a maximum and minimum column width
  4.1592 +  from the cells that span only that column. The minimum is that
  4.1593 +  required by the cell with the largest minimum cell width (or the
  4.1594 +  column 'width', whichever is
  4.1595 +  larger). The maximum is that required by the cell with the largest
  4.1596 +  maximum cell width (or the column
  4.1597 +  'width', whichever is larger).
  4.1598 +
  4.1599 +  <li><p>For each cell that spans more than one column, increase the
  4.1600 +  minimum widths of the columns it spans so that together, they are at
  4.1601 +  least as wide as the cell. Do the same for the maximum widths. If
  4.1602 +  possible, widen all spanned columns by approximately the same
  4.1603 +  amount.
  4.1604 +
  4.1605 +  <li><p>For each column group element with a 'width' other than
  4.1606 +  ''auto'', increase the minimum widths of the columns it spans, so that
  4.1607 +  together they are at least as wide as the column group's 'width'.
  4.1608 +
  4.1609 +</ol>
  4.1610 +
  4.1611 +<p>This gives a maximum and minimum width for each column. Column
  4.1612 +widths influence the final table width as follows:
  4.1613 +
  4.1614 +<ol>
  4.1615 +  <li>If the 'table' or 'inline-table' element's
  4.1616 +  'width' property has a computed value
  4.1617 +  (W) other than 'auto', the property's value as used for layout is
  4.1618 +  the greater of W and the minimum width required by all the columns
  4.1619 +  plus cell spacing or borders (MIN). If W is greater than MIN, the
  4.1620 +  extra width should be distributed over the columns.
  4.1621 +
  4.1622 +  <li>If the ''table'' or ''inline-table'' element has 'width: auto',
  4.1623 +  the table width used for layout is the greater of the table's
  4.1624 +  containing block width and MIN. However, if the maximum width
  4.1625 +  required by the columns plus cell spacing or borders (MAX) is less
  4.1626 +  than that of the containing block, use MAX.
  4.1627 +</ol>
  4.1628 +
  4.1629 +<p>A percentage value for a column width is relative to the table
  4.1630 +width. If the table has 'width: auto', a percentage represents a
  4.1631 +constraint on the column's width, which a UA should try to satisfy.
  4.1632 +(Obviously, this is not always possible: if the column's width is
  4.1633 +'110%', the constraint cannot be satisfied.)
  4.1634 +
  4.1635 +<p class=note>In this algorithm, rows (and row
  4.1636 +groups) and columns (and column groups) both constrain and are
  4.1637 +constrained by the dimensions of the cells they contain. Setting the
  4.1638 +width of a column may indirectly influence the height of a row, and
  4.1639 +vice versa.
  4.1640 +
  4.1641 +<h3 id="height-layout">Table height algorithms</h3>
  4.1642 +
  4.1643 +<p>The height of a table is given by the
  4.1644 +'height' property for the 'table' or
  4.1645 +'inline-table' element. A value of 'auto' means that the height is the
  4.1646 +sum of the row heights plus any cell spacing or borders. Any other
  4.1647 +value specifies the height explicitly; the table may thus be taller or
  4.1648 +shorter than the height of its rows. 
  4.1649 +The 'height' property on ''table''
  4.1650 +boxes is treated as a minimum height. CSS3 does not define how
  4.1651 +extra space is distributed when the 'height' property causes the table
  4.1652 +to be taller than it otherwise would be.
  4.1653 +<span class=issue>Specify this?</span>
  4.1654 +
  4.1655 +<p>The height of a ''table-row'' element's box is calculated once the
  4.1656 +user agent has all the cells in the row available: it is the maximum
  4.1657 +of the row's specified 'height' and the minimum height (MIN) required
  4.1658 +by the cells. A 'height' value of 'auto' for a ''table-row'' means the
  4.1659 +row height used for layout is MIN. MIN depends on cell box heights and
  4.1660 +cell box alignment (much like the calculation of a <em>line box</em>
  4.1661 +height). Percentage heights on table cells, table rows, and table row
  4.1662 +groups compute to ''auto''.
  4.1663 +
  4.1664 +<p>In CSS3, the height of a cell box is the maximum of the table
  4.1665 +cell's 'height' property and the minimum height required by the
  4.1666 +content (MIN). A value of 'auto' for 'height' implies that the value
  4.1667 +MIN will be used for layout. CSS3 does not define what percentage
  4.1668 +values of 'height' refer to when specified for table cells.
  4.1669 +
  4.1670 +<p>CSS3 does not specify how cells that span more than one row
  4.1671 +affect row height calculations except that the sum of the row heights
  4.1672 +involved must be great enough to encompass the cell spanning the rows.
  4.1673 +
  4.1674 +<p>The 'vertical-align' property of each table cell determines its
  4.1675 +alignment within the row. Each cell's content has a baseline, a top, a
  4.1676 +middle, and a bottom, as does the row itself. In the context of
  4.1677 +tables, values for 'vertical-align' have the following meanings:
  4.1678 +
  4.1679 +<dl>
  4.1680 +  <dt><dfn>baseline</dfn>
  4.1681 +
  4.1682 +    <dd>The baseline of the cell is put at the same height as the
  4.1683 +    baseline of the first of the rows it spans (see below for the
  4.1684 +    definition of baselines of cells and rows).
  4.1685 +
  4.1686 +  <dt><dfn>top</dfn>
  4.1687 +
  4.1688 +    <dd>The top of the cell box is aligned with the top of the first
  4.1689 +    row it spans.
  4.1690 +
  4.1691 +  <dt><dfn>bottom</dfn>
  4.1692 +
  4.1693 +    <dd>The bottom of the cell box is aligned with the bottom of the
  4.1694 +    last row it spans.
  4.1695 +
  4.1696 +  <dt><dfn>middle</dfn>
  4.1697 +
  4.1698 +    <dd>The center of the cell is aligned with the center of the rows
  4.1699 +    it spans.
  4.1700 +
  4.1701 +  <dt>sub, <dt>super, <dt>text-top, <dt>text-bottom,
  4.1702 +  <dt>&lt;length&gt;, <dt>&lt;percentage&gt;
  4.1703 +
  4.1704 +    <dd>These values do not apply to cells; the cell is aligned at the
  4.1705 +    baseline instead.
  4.1706 +</dl>
  4.1707 +
  4.1708 +<p>The baseline of a cell is the baseline of the first in-flow
  4.1709 +<em>line box</em> in the cell, or the first in-flow table-row in the
  4.1710 +cell, whichever comes first. If there is no such line box or
  4.1711 +table-row, the baseline is the bottom of content edge of the cell box. 
  4.1712 +For the purposes of finding a baseline, in-flow boxes with a scrolling
  4.1713 +mechanisms (see the 'overflow' property) must be considered as if
  4.1714 +scrolled to their origin position. Note that the baseline of a cell
  4.1715 +may end up below its bottom border, see the <a
  4.1716 +href="#baseline-below">example</a> below.
  4.1717 +
  4.1718 +<p>The maximum distance between the top of the cell box and the
  4.1719 +baseline over all cells that have 'vertical-align: baseline' is used
  4.1720 +to set the <dfn title="baseline of a row">baseline of the row.</dfn>
  4.1721 +Here is an example:
  4.1722 +
  4.1723 +<div class="figure">
  4.1724 +  <p><img src="cell-align.png" alt="Example of vertically aligning the
  4.1725 +  cells">
  4.1726 +
  4.1727 +  <p class="caption">Diagram showing the effect of various values of
  4.1728 +  'vertical-align' on table cells.
  4.1729 +</div>
  4.1730 +
  4.1731 +<p>Cell boxes 1 and 2 are aligned at their baselines. Cell box 2 has
  4.1732 +the largest height above the baseline, so that determines the baseline
  4.1733 +of the row.
  4.1734 +
  4.1735 +<p>If a row has no cell box aligned to its baseline, the baseline of
  4.1736 +that row is the bottom content edge of the lowest cell in the row.
  4.1737 +
  4.1738 +<p>To avoid ambiguous situations, the alignment of cells proceeds in
  4.1739 +the following order:
  4.1740 +
  4.1741 +<ol>
  4.1742 +  <li>First the cells that are aligned on their baseline are
  4.1743 +  positioned. This will establish the baseline of the row. Next the
  4.1744 +  cells with 'vertical-align: top' are positioned.
  4.1745 +
  4.1746 +  <li>The row now has a top, possibly a baseline, and a provisional
  4.1747 +  height, which is the distance from the top to the lowest bottom of
  4.1748 +  the cells positioned so far. (See conditions on the cell padding
  4.1749 +  below.)
  4.1750 +
  4.1751 +  <li>If any of the remaining cells, those aligned at the bottom or
  4.1752 +  the middle, have a height that is larger than the current height of
  4.1753 +  the row, the height of the row will be increased to the maximum of
  4.1754 +  those cells, by lowering the bottom.
  4.1755 +
  4.1756 +  <li>Finally the remaining cells are positioned.
  4.1757 +</ol>
  4.1758 +
  4.1759 +<p>Cell boxes that are smaller than the height of the row receive
  4.1760 +extra top or bottom padding.
  4.1761 +
  4.1762 +<div class=example id=baseline-below>
  4.1763 +<p>The cell in this example has a baseline below its bottom border:
  4.1764 +
  4.1765 +<pre>
  4.1766 +div { height: 0; overflow: hidden; }
  4.1767 +
  4.1768 +&lt;table>
  4.1769 + &lt;tr>
  4.1770 +  &lt;td>
  4.1771 +   &lt;div> Test &lt;/div>
  4.1772 +  &lt;/td>
  4.1773 + &lt;/tr>
  4.1774 +&lt;/table>
  4.1775 +</pre>
  4.1776 +</div>
  4.1777 +
  4.1778 +<h3 id="column-alignment">Horizontal alignment in a column</h3>
  4.1779 +
  4.1780 +<p>The horizontal alignment of a cell's content within a cell box is
  4.1781 +specified with the 'text-align' property.
  4.1782 +
  4.1783 +<p>When the 'text-align' property for more than one cell in a column
  4.1784 +is set to a &lt;string&gt; value, the content of those cells is
  4.1785 +aligned along a vertical axis. The beginning of the string touches
  4.1786 +this axis. Character directionality determines whether the string lies
  4.1787 +to the left or right of the axis.
  4.1788 +
  4.1789 +<p>Aligning text in this way is only useful if the text fits on one
  4.1790 +line. The result is undefined if the cell content spans more than one
  4.1791 +line.
  4.1792 +
  4.1793 +<p>If value of 'text-align' for a table cell is a string but the
  4.1794 +string doesn't occur in the cell content, the end of the cell's
  4.1795 +content touches the vertical axis of alignment.
  4.1796 +
  4.1797 +<p>Note that the strings do not have to be the same for each cell,
  4.1798 +although they usually are.
  4.1799 +
  4.1800 +<p>CSS does not provide a way specify the offset of the vertical
  4.1801 +alignment axis with respect to the edge of a column box.
  4.1802 +
  4.1803 +<div class="example">
  4.1804 +<p>The following style sheet:
  4.1805 +
  4.1806 +<pre>
  4.1807 +TD { text-align: "." }
  4.1808 +TD:before { content: "$" }
  4.1809 +</pre>
  4.1810 +
  4.1811 +<p>will cause the column of dollar figures in the following HTML
  4.1812 +table:
  4.1813 +
  4.1814 +<pre>
  4.1815 +&lt;TABLE&gt;
  4.1816 +  &lt;COL width="40"&gt;
  4.1817 +  &lt;TR&gt; &lt;TH&gt;Long distance calls
  4.1818 +  &lt;TR&gt; &lt;TD&gt; 1.30
  4.1819 +  &lt;TR&gt; &lt;TD&gt; 2.50
  4.1820 +  &lt;TR&gt; &lt;TD&gt; 10.80
  4.1821 +  &lt;TR&gt; &lt;TD&gt; 111.01
  4.1822 +  &lt;TR&gt; &lt;TD&gt; 85.
  4.1823 +  &lt;TR&gt; &lt;TD&gt; 90
  4.1824 +  &lt;TR&gt; &lt;TD&gt; .05
  4.1825 +  &lt;TR&gt; &lt;TD&gt; .06
  4.1826 +  &lt;/TABLE&gt;
  4.1827 +</pre>
  4.1828 +
  4.1829 +<p>to align along the decimal point. For fun, we have used the <span
  4.1830 +class=css>:before</span> pseudo-element to insert a dollar sign before
  4.1831 +each figure. The table might be rendered as follows:
  4.1832 +
  4.1833 +<pre>
  4.1834 +Long distance calls
  4.1835 +              $1.30      
  4.1836 +              $2.50
  4.1837 +             $10.80
  4.1838 +            $111.01
  4.1839 +             $85.
  4.1840 +             $90
  4.1841 +               $.05
  4.1842 +               $.06
  4.1843 +</pre>
  4.1844 +</div>
  4.1845 +
  4.1846 +<!-- dynamic effect -->
  4.1847 +
  4.1848 +<h3 id="dynamic-effects">Dynamic row and column effects</h3>
  4.1849 +
  4.1850 +<p>The 'visibility' property
  4.1851 +takes the value ''collapse'' for row, row group, column, and column
  4.1852 +group elements. This value causes the entire row or column to be
  4.1853 +removed from the display, and the space normally taken up by the row
  4.1854 +or column to be made available for other content. Contents of spanned
  4.1855 +rows and columns that intersect the collapsed column or row are
  4.1856 +clipped. The suppression of the row or column, however, does not
  4.1857 +otherwise affect the layout of the table. This allows dynamic effects
  4.1858 +to remove table rows or columns without forcing a re-layout of the
  4.1859 +table in order to account for the potential change in column
  4.1860 +constraints.
  4.1861 +
  4.1862 +<h2 id="borders">Borders</h2>
  4.1863 +
  4.1864 +<p>There are two distinct models for setting borders on table cells in
  4.1865 +CSS. One is most suitable for so-called <em>separated borders</em>
  4.1866 +around individual
  4.1867 +cells, the other is suitable for borders that are continuous from one
  4.1868 +end of the table to the other. Many border styles can be achieved with
  4.1869 +either model, so it is often a matter of taste which one is used.
  4.1870 +
  4.1871 +<table class=propdef>
  4.1872 +    <tr>
  4.1873 +      <td><em>Name:</em>
  4.1874 +      <td><dfn>border-collapse</dfn>
  4.1875 +    <tr>
  4.1876 +      <td><em>Value:</em>
  4.1877 +      <td>collapse | separate
  4.1878 +    <tr>
  4.1879 +      <td><em>Initial:</em>
  4.1880 +      <td>collapse
  4.1881 +    <tr>
  4.1882 +      <td><em>Applies to:</em>
  4.1883 +      <td>'table' and 'inline-table' elements
  4.1884 +    <tr>
  4.1885 +      <td><em>Inherited:</em>
  4.1886 +      <td>yes
  4.1887 +    <tr>
  4.1888 +      <td><em>Percentages:</em>
  4.1889 +      <td>N/A
  4.1890 +    <tr>
  4.1891 +      <td><em>Media:</em>
  4.1892 +      <td>visual
  4.1893 +    <tr>
  4.1894 +      <td><em>Computed&nbsp;value:</em>
  4.1895 +      <td>specified value
  4.1896 +</table>
  4.1897 +
  4.1898 +<p>This property selects a table's border model. The value 'separate'
  4.1899 +selects the separated borders border model. The value 'collapse'
  4.1900 +selects the collapsing borders model. The models are described below.
  4.1901 +
  4.1902 +<h3 id="separated-borders">The separated borders model</h3>
  4.1903 +
  4.1904 +<table class=propdef>
  4.1905 +    <tr>
  4.1906 +      <td><em>Name:</em>
  4.1907 +      <td><dfn>border-spacing</dfn>
  4.1908 +    <tr>
  4.1909 +      <td><em>Value:</em>
  4.1910 +      <td>&lt;length&gt; &lt;length&gt;?
  4.1911 +    <tr>
  4.1912 +      <td><em>Initial:</em>
  4.1913 +      <td>0
  4.1914 +    <tr>
  4.1915 +      <td><em>Applies to:</em>
  4.1916 +      <td>'table' and 'inline-table' elements*
  4.1917 +    <tr>
  4.1918 +      <td><em>Inherited:</em>
  4.1919 +      <td>yes
  4.1920 +    <tr>
  4.1921 +      <td><em>Percentages:</em>
  4.1922 +      <td>N/A
  4.1923 +    <tr>
  4.1924 +      <td><em>Media:</em>
  4.1925 +      <td>visual
  4.1926 +    <tr>
  4.1927 +      <td><em>Computed&nbsp;value:</em>
  4.1928 +      <td>specified value
  4.1929 +</table>
  4.1930 +
  4.1931 +<p class="note">*) Note: user agents may also apply the
  4.1932 +border-spacing' property to frameset elements. Which elements are
  4.1933 +frameset elements is not defined by this specification and is up to
  4.1934 +the document language. For example, HTML4 defines a &lt;FRAMESET>
  4.1935 +element, and XHTML 1.0 defines a &lt;frameset> element. The
  4.1936 +'border-spacing' property on a frameset element can be thus used as a
  4.1937 +valid substitute for the nonstandard framespacing attribute.
  4.1938 +
  4.1939 +<p class="issue">[During the 20 Aug 2001 ftf, we decided to add a
  4.1940 +property to let the designer choose what background is drawn in
  4.1941 +border-spacing: the table's background (as in CSS2), half of the
  4.1942 +cells' background on either side, half of the rows' background on
  4.1943 +either side, some completely different background...]
  4.1944 +
  4.1945 +<p>The lengths specify the distance that separates adjoining cell
  4.1946 +borders. If one length is specified, it gives both the horizontal and
  4.1947 +vertical spacing. If two are specified, the first gives the horizontal
  4.1948 +spacing and the second the vertical spacing. Lengths may not be
  4.1949 +negative.
  4.1950 +
  4.1951 +<p>The distance between the table border and the borders of the cells
  4.1952 +on the edge of the table is the table's padding for that side, plus
  4.1953 +the relevant border spacing distance. For example, on the right hand
  4.1954 +side, the distance is <var>padding-right</var> + <var>horizontal
  4.1955 +border-spacing</var>.
  4.1956 +
  4.1957 +<p>The width of the table is the distance from the left inner padding
  4.1958 +edge to the right inner padding edge (including the border spacing but
  4.1959 +excluding padding and border).
  4.1960 +
  4.1961 +<p>However, in HTML and XHTML1, the width of the &lt;table&gt;
  4.1962 +element is the distance from the left border edge to the right border
  4.1963 +edge.
  4.1964 +
  4.1965 +<p class=issue>Remove the previous paragraph and instead add
  4.1966 +'box-sizing' to the sample style for HTML.
  4.1967 +
  4.1968 +<p>In this model, each cell has an individual border. The
  4.1969 +'border-spacing' property specifies the distance between the borders
  4.1970 +of adjoining cells. In this space, the row, column, row group, and
  4.1971 +column group backgrounds are invisible, allowing the table background
  4.1972 +to show through. Rows, columns, row groups, and column groups cannot
  4.1973 +have borders (i.e., user agents must ignore the border properties for
  4.1974 +those elements).
  4.1975 +
  4.1976 +<div class="example">
  4.1977 +<p>The table in the figure below could be the result of a style sheet
  4.1978 +like this:
  4.1979 +
  4.1980 +<pre>
  4.1981 +table      { border: outset 10pt; 
  4.1982 +             border-collapse: separate;
  4.1983 +             border-spacing: 15pt }
  4.1984 +td         { border: inset 5pt }
  4.1985 +td.special { border: inset 10pt }  /* The top-left cell */
  4.1986 +</pre>
  4.1987 +
  4.1988 +<div class=figure>
  4.1989 +  <p><img src="tbl-spacing.png" alt="A table with border-spacing">
  4.1990 +
  4.1991 +  <p class="caption">A table with 'border-spacing' set to a length
  4.1992 +  value. Note that each cell has its own border, and the table has a
  4.1993 +  separate border as well.
  4.1994 +</div>
  4.1995 +</div>
  4.1996 +
  4.1997 +<h4 id="empty-cells">Borders around empty cells: the 'empty-cells'
  4.1998 +property</h4>
  4.1999 +
  4.2000 +<table class=propdef>
  4.2001 +    <tr>
  4.2002 +      <td><em>Name:</em>
  4.2003 +      <td><dfn>empty-cells</dfn>
  4.2004 +    <tr>
  4.2005 +      <td><em>Value:</em>
  4.2006 +      <td>show | hide
  4.2007 +    <tr>
  4.2008 +      <td><em>Initial:</em>
  4.2009 +      <td>show
  4.2010 +    <tr>
  4.2011 +      <td><em>Applies to:</em>
  4.2012 +      <td>'table-cell' elements
  4.2013 +    <tr>
  4.2014 +      <td><em>Inherited:</em>
  4.2015 +      <td>yes
  4.2016 +    <tr>
  4.2017 +      <td><em>Percentages:</em>
  4.2018 +      <td>N/A
  4.2019 +    <tr>
  4.2020 +      <td><em>Media:</em>
  4.2021 +      <td>visual
  4.2022 +    <tr>
  4.2023 +      <td><em>Computed&nbsp;value:</em>
  4.2024 +      <td>as specified 
  4.2025 +</table>
  4.2026 +
  4.2027 +<p>In the separated borders model, this property controls the
  4.2028 +rendering of borders and backgrounds around cells that have no visible
  4.2029 +content. Empty cells and cells with the
  4.2030 +'visibility' property set to
  4.2031 +'hidden' are considered to have no visible content.
  4.2032 +Cells are empty unless they contain one or more of the following:
  4.2033 +<ul>
  4.2034 +<li>floating content (including empty elements),
  4.2035 +<li>in-flow content (including empty elements) other than whitespace
  4.2036 +that has been collapsed away by the 'white-space' property handling.
  4.2037 +</ul>
  4.2038 +
  4.2039 +<p>When this property has the value 'show', borders and backgrounds
  4.2040 +are drawn around/behind empty cells (like normal cells).
  4.2041 +
  4.2042 +<p>A value of 'hide' means that no borders or backgrounds are drawn
  4.2043 +around/behind empty cells (see point 6 in <a
  4.2044 +href="#table-layers">“Table layers and transparency”</a>).
  4.2045 +Furthermore, if all the cells in a
  4.2046 +row have a value of 'hide' and have no visible content, the entire row
  4.2047 +behaves as if it had 'display: none'.
  4.2048 +
  4.2049 +<div class="example">
  4.2050 +<p>The following rule causes borders and backgrounds to be drawn
  4.2051 +around all cells:
  4.2052 +
  4.2053 +<pre>
  4.2054 +table { empty-cells: show }
  4.2055 +</pre>
  4.2056 +</div>
  4.2057 +
  4.2058 +<h3 id="collapsing-borders">The collapsing border model</h3>
  4.2059 +
  4.2060 +<p>In the collapsing border model, it is possible to specify borders
  4.2061 +that surround all or part of a cell, row, row group, column, and
  4.2062 +column group. Borders for HTML's "rule" attribute can be specified
  4.2063 +this way.
  4.2064 +
  4.2065 +<p>Borders are centered on the grid lines between the cells. User
  4.2066 +agents must find a consistent rule for rounding off in the case of an
  4.2067 +odd number of discrete units (screen pixels, printer dots).
  4.2068 +
  4.2069 +<p>The diagram below shows how the width of the table, the widths of
  4.2070 +the borders, the padding, and the cell width interact. Their relation
  4.2071 +is given by the following equation, which holds for every row of the
  4.2072 +table:
  4.2073 +
  4.2074 +<blockquote>
  4.2075 +<p><var>row-width</var> = (0.5 * <var>border-width</var><sub>0</sub>)
  4.2076 ++ <var>padding-left</var><sub>1</sub> + <var>width</var><sub>1</sub> +
  4.2077 +<var>padding-right</var><sub>1</sub> +
  4.2078 +<var>border-width</var><sub>1</sub> +
  4.2079 +<var>padding-left</var><sub>2</sub> +...+
  4.2080 +<var>padding-right</var><sub><var>n</var></sub> + (0.5 *
  4.2081 +<var>border-width</var><sub><var>n</var></sub>)
  4.2082 +</blockquote>
  4.2083 +
  4.2084 +<p>Here <var>n</var> is the number of cells in the row,
  4.2085 +<var>padding-left</var><sub><var>i</var></sub> and
  4.2086 +<var>padding-right</var><sub><var>i</var></sub> refer to the left
  4.2087 +(resp., right) padding of cell <var>i</var>, and
  4.2088 +<var>border-width</var><sub><var>i</var></sub> refers to the border
  4.2089 +between cells <var>i</var> and <var>i</var> + 1.
  4.2090 +
  4.2091 +<p>UAs must compute an initial left and right border width for the
  4.2092 +table by examining the first and last cells in the first row of the
  4.2093 +table. The left border width of the table is half of the first cell's
  4.2094 +collapsed left border, and the right border width of the table is half
  4.2095 +of the last cell's collapsed right border. If subsequent rows have
  4.2096 +larger collapsed left and right borders, then any excess spills into
  4.2097 +the margin area of the table.
  4.2098 +
  4.2099 +<p>The top border width of the table is computed by examining all
  4.2100 +cells who collapse their top borders with the top border of the table.
  4.2101 +The top border width of the table is equal to half of the maximum
  4.2102 +collapsed top border. The bottom border width is computed by examining
  4.2103 +all cells whose bottom borders collapse with the bottom of the table.
  4.2104 +The bottom border width is equal to half of the maximum collapsed
  4.2105 +bottom border.
  4.2106 +
  4.2107 +<p>Any borders that spill into the margin are taken into account when
  4.2108 +determining if the table overflows some ancestor (see <span
  4.2109 +class="propinst-overflow">'overflow'</span>).</p>
  4.2110 +
  4.2111 +<div class="figure">
  4.2112 +  <p><img src="tbl-width.png" alt="Schema showing the widths of cells
  4.2113 +  and borders and the padding of cells">
  4.2114 +
  4.2115 +  <p class="caption">Schema showing the widths of cells and borders
  4.2116 +  and the padding of cells.
  4.2117 +</div>
  4.2118 +
  4.2119 +<p>Note that in this model, the width of the table includes half the
  4.2120 +table border. Also, in this model, a table doesn't have padding (but
  4.2121 +does have margins).
  4.2122 +
  4.2123 +<p>CSS3 does not define where the edge of a background on a
  4.2124 +table element lies.
  4.2125 +
  4.2126 +<h4 id="border-conflict-resolution">Border conflict resolution</h4>
  4.2127 +
  4.2128 +<p>In the collapsing border model, borders at every edge of every cell
  4.2129 +may be specified by border properties on a variety of elements that
  4.2130 +meet at that edge (cells, rows, row groups, columns, column groups,
  4.2131 +and the table itself), and these borders may vary in width, style, and
  4.2132 +color. The rule of thumb is that at each edge the most "eye catching"
  4.2133 +border style is chosen, except that any occurrence of the style
  4.2134 +'hidden' unconditionally turns the border off.
  4.2135 +
  4.2136 +<p>The following rules determine which border style “wins”in case of
  4.2137 +a conflict:
  4.2138 +
  4.2139 +<ol>
  4.2140 +  <li>Borders with the 'border-style' of ''hidden'' take precedence
  4.2141 +  over all other conflicting borders. Any border with this value
  4.2142 +  suppresses all borders at this location.
  4.2143 +
  4.2144 +  <li>Borders with a style of ''none'' have the lowest priority. Only
  4.2145 +  if the border properties of all the elements meeting at this edge
  4.2146 +  are ''none'' will the border be omitted (but note that ''none'' is
  4.2147 +  the default value for the border style.)
  4.2148 +
  4.2149 +  <li>If none of the styles are ''hidden'' and at least one of them is
  4.2150 +  not ''none'', then narrow borders are discarded in favor of wider
  4.2151 +  ones. If several have the same 'border-width' then styles are
  4.2152 +  preferred in this order: ''double'', ''solid'', ''dashed'',
  4.2153 +  ''dotted'', ''ridge'', ''outset'', ''groove'', and the lowest:
  4.2154 +  ''inset''.
  4.2155 +
  4.2156 +  <li>If border styles differ only in color, then a style set on a
  4.2157 +  cell wins over one on a row, which wins over a row group, column,
  4.2158 +  column group and, lastly, table. When two elements of the same type
  4.2159 +  conflict, then the one further to the left (if the table's
  4.2160 +  'direction' is ''ltr''; right, if it is ''rtl'') and further to the
  4.2161 +  top wins.
  4.2162 +</ol>
  4.2163 +
  4.2164 +<div class="example">
  4.2165 +<p>The following example illustrates the application of these
  4.2166 +precedence rules. This style sheet:
  4.2167 +
  4.2168 +<pre>
  4.2169 +table          { border-collapse: collapse;
  4.2170 +                 border: 5px solid yellow; }
  4.2171 +*#col1         { border: 3px solid black; }
  4.2172 +td             { border: 1px solid red; padding: 1em; }
  4.2173 +td.cell5       { border: 5px dashed blue; }
  4.2174 +td.cell6       { border: 5px solid green; }
  4.2175 +</pre>
  4.2176 +
  4.2177 +<p>with this HTML source:
  4.2178 +
  4.2179 +<pre>
  4.2180 +&lt;TABLE&gt;
  4.2181 +&lt;COL id=&quot;col1&quot;&gt;&lt;COL id=&quot;col2&quot;&gt;&lt;COL id=&quot;col3&quot;&gt;
  4.2182 +&lt;TR id=&quot;row1&quot;&gt;
  4.2183 +    &lt;TD&gt; 1
  4.2184 +    &lt;TD&gt; 2
  4.2185 +    &lt;TD&gt; 3
  4.2186 +&lt;/TR&gt;
  4.2187 +&lt;TR id=&quot;row2&quot;&gt;
  4.2188 +    &lt;TD&gt; 4 
  4.2189 +    &lt;TD class="cell5"&gt; 5
  4.2190 +    &lt;TD class="cell6"&gt; 6
  4.2191 +&lt;/TR&gt;
  4.2192 +&lt;TR id=&quot;row3&quot;&gt;
  4.2193 +    &lt;TD&gt; 7
  4.2194 +    &lt;TD&gt; 8
  4.2195 +    &lt;TD&gt; 9
  4.2196 +&lt;/TR&gt;
  4.2197 +&lt;TR id=&quot;row4&quot;&gt;
  4.2198 +    &lt;TD&gt; 10
  4.2199 +    &lt;TD&gt; 11
  4.2200 +    &lt;TD&gt; 12
  4.2201 +&lt;/TR&gt;
  4.2202 +&lt;TR id=&quot;row5&quot;&gt;
  4.2203 +    &lt;TD&gt; 13
  4.2204 +    &lt;TD&gt; 14
  4.2205 +    &lt;TD&gt; 15
  4.2206 +&lt;/TR&gt;
  4.2207 +&lt;/TABLE&gt;
  4.2208 +</pre>
  4.2209 +
  4.2210 +<p>would produce something like this:
  4.2211 +
  4.2212 +<div class="figure">
  4.2213 +  <p><img src="tbl-border-conflict.png" alt="An example of a table
  4.2214 +  with collapsed borders">
  4.2215 +
  4.2216 +  <p class="caption">An example of a table with collapsed borders.
  4.2217 +</div>
  4.2218 +</div>
  4.2219 +
  4.2220 +<div class="example">
  4.2221 +<p>Here is an example of hidden collapsing borders:
  4.2222 +
  4.2223 +<div class="figure">
  4.2224 +  <p><img src="CSStbl3.png" alt="Table with two omitted borders">
  4.2225 +
  4.2226 +  <p class="caption"> Table with two omitted internal borders.
  4.2227 +</div>
  4.2228 +
  4.2229 +<p>HTML source:
  4.2230 +
  4.2231 +<pre class="html-example">
  4.2232 +&lt;TABLE style="border-collapse: collapse; border: solid;"&gt;
  4.2233 +&lt;TR&gt;&lt;TD style="border-right: hidden; border-bottom: hidden"&gt;foo&lt;/TD&gt;
  4.2234 +    &lt;TD style="border: solid"&gt;bar&lt;/TD&gt;&lt;/TR&gt;
  4.2235 +&lt;TR&gt;&lt;TD style="border: none"&gt;foo&lt;/TD&gt;
  4.2236 +    &lt;TD style="border: solid"&gt;bar&lt;/TD&gt;&lt;/TR&gt;
  4.2237 +&lt;/TABLE&gt;
  4.2238 +</pre>
  4.2239 +</div>
  4.2240 +
  4.2241 +<h4 id="collapsed-bg">Backgrounds in the collapsed border model</h4>
  4.2242 +
  4.2243 +<!--
  4.2244 +<p>CSS3 does not define where the edge of a background on a table
  4.2245 +element lies. <span class=issue>It still doesn't?</span>
  4.2246 +-->
  4.2247 +
  4.2248 +<p>Backgrounds of cells, rows, columns, etc., are drawn inside the
  4.2249 +grid lines that enclose that cell, row, etc. I.e., if there is a
  4.2250 +border, the background starts in the middle of the border. The
  4.2251 +adjoining cell draws the background of the other half of the border.
  4.2252 +
  4.2253 +<p>The exception are the outer edges of the table. Here the background
  4.2254 +doesn't start in the middle of the border, but starts a little further
  4.2255 +outside. How far outside is determined by the <span
  4.2256 +class=property>border-width</span> property of the table element: the
  4.2257 +background starts half the value of border-width outside the grid.
  4.2258 +
  4.2259 +<p class=note>Note that this means that, if the cells, rows, etc.,
  4.2260 +don't specify any borders that collapse with the table's border, the
  4.2261 +background will be drawn under the whole border, from border edge to
  4.2262 +border edge, exactly as for non-table elements.
  4.2263 +
  4.2264 +<div class=example>
  4.2265 +<p>Here is a table with three rows and a yellow background. The table
  4.2266 +element has a 0.5em border, but the first cell has a 1em border, which
  4.2267 +will therefore not be fully covered by the table's background:
  4.2268 +
  4.2269 +<pre>
  4.2270 +&lt;table style="background: yellow; border: 0.5em dotted"&gt;
  4.2271 +  &lt;tr&gt;
  4.2272 +    &lt;td style="border: 1em dotted"&gt;... &lt;/td&gt;
  4.2273 +  &lt;/tr&gt;
  4.2274 +  &lt;tr&gt;
  4.2275 +    &lt;td&gt;... &lt;/td&gt;
  4.2276 +  &lt;/tr&gt;
  4.2277 +  &lt;tr&gt;
  4.2278 +    &lt;td&gt;... &lt;/td&gt;
  4.2279 +  &lt;/tr&gt;
  4.2280 +&lt;/table&gt;
  4.2281 +</pre>
  4.2282 +
  4.2283 +<div class="figure">
  4.2284 +  <p><img src="bg.png" alt="The background covers the small dots, but
  4.2285 +  not the big ones">
  4.2286 +
  4.2287 +  <p class="caption">The background extends to the width given by the
  4.2288 +  border-width property of the table element. The border-width of the
  4.2289 +  first row is larger and thus the border extends outside the
  4.2290 +  background.
  4.2291 +</div>
  4.2292 +</div>
  4.2293 +
  4.2294 +<h3>Border styles</h3>
  4.2295 +
  4.2296 +<p>Some of the values of the 'border-style' have different meanings in
  4.2297 +tables than for other elements. In the list below they are marked with
  4.2298 +an asterisk.
  4.2299 +
  4.2300 +<dl>
  4.2301 +  <dt><dfn>none</dfn>
  4.2302 +
  4.2303 +    <dd>No border.
  4.2304 +
  4.2305 +  <dt>*<dfn>hidden</dfn>
  4.2306 +
  4.2307 +    <dd>Same as 'none', but in the <a
  4.2308 +    href="#collapsing-borders">collapsing border model</a>, also
  4.2309 +    inhibits any other border (see the section on <a
  4.2310 +    href="#border-conflict-resolution">border conflicts</a>).
  4.2311 +
  4.2312 +  <dt><dfn>dotted</dfn>
  4.2313 +
  4.2314 +    <dd>The border is a series of dots.
  4.2315 +
  4.2316 +  <dt><dfn>dashed</dfn>
  4.2317 +
  4.2318 +    <dd>The border is a series of short line segments.
  4.2319 +
  4.2320 +  <dt><dfn>solid</dfn>
  4.2321 +
  4.2322 +    <dd>The border is a single line segment.
  4.2323 +
  4.2324 +  <dt><dfn>double</dfn>
  4.2325 +
  4.2326 +    <dd>The border is two solid lines. The sum of the two lines and
  4.2327 +    the space between them equals the value of 'border-width'.
  4.2328 +
  4.2329 +  <dt><dfn>groove</dfn>
  4.2330 +
  4.2331 +    <dd>The border looks as though it were carved into the canvas.
  4.2332 +
  4.2333 +  <dt><dfn>ridge</dfn>
  4.2334 +
  4.2335 +    <dd>The opposite of ''groove'': the border looks as though it were
  4.2336 +    coming out of the canvas.
  4.2337 +
  4.2338 +  <dt>*<dfn>inset</dfn>
  4.2339 +
  4.2340 +    <dd>In the <a href="#separated-borders">separated borders
  4.2341 +    model</a>, the border makes the entire box look as though it were
  4.2342 +    embedded in the canvas. In the <a
  4.2343 +    href="#collapsing-borders">collapsing border model</a>, same as
  4.2344 +    'ridge'.
  4.2345 +
  4.2346 +  <dt>*<dfn>outset</dfn>
  4.2347 +
  4.2348 +    <dd>In the <a href="#separated-borders">separated borders
  4.2349 +    model</a>, the border makes the entire box look as though it were
  4.2350 +    coming out of the canvas. In the <a
  4.2351 +    href="#collapsing-borders">collapsing border model</a>, same as
  4.2352 +    'groove'.
  4.2353 +</dl>
  4.2354 +
  4.2355 +<h2>The 'table-column-span' and 'table-row-span' properties</h2>
  4.2356 +
  4.2357 +<table class=propdef>
  4.2358 +    <tr>
  4.2359 +      <td><em>Name:</em>
  4.2360 +      <td><dfn>table-column-span</dfn>, <dfn>table-row-span</dfn>
  4.2361 +    <tr>
  4.2362 +      <td><em>Value:</em>
  4.2363 +      <td>auto | attr(...)
  4.2364 +    <tr>
  4.2365 +      <td><em>Initial:</em>
  4.2366 +      <td>auto
  4.2367 +    <tr>
  4.2368 +      <td><em>Applies to:</em>
  4.2369 +      <td>table cells
  4.2370 +    <tr>
  4.2371 +      <td><em>Inherited:</em>
  4.2372 +      <td>no
  4.2373 +    <tr>
  4.2374 +      <td><em>Percentages:</em>
  4.2375 +      <td>N/A
  4.2376 +    <tr>
  4.2377 +      <td><em>Media:</em>
  4.2378 +      <td>visual
  4.2379 +    <tr>
  4.2380 +      <td><em>Computed&nbsp;value:</em>
  4.2381 +      <td>specified value
  4.2382 +</table>
  4.2383 +
  4.2384 +<p>The properties 'table-column-span' and
  4.2385 +'table-row-span' specify which attributes in
  4.2386 +the source document contain the number of columns, resp. rows that the
  4.2387 +element spans. See <a href="#Visual">“visual layout of table
  4.2388 +contents.”</a> It only affects elements that are rendered as
  4.2389 +table cells (<span class="css">'display: table-cell'</span>).
  4.2390 +
  4.2391 +<p>A value of 'attr(<var>X</var>)' means that
  4.2392 +the attribute <var>X</var> of the current element must be parsed as a
  4.2393 +number. If there is no attribute <var>X</var> or it does not contain a
  4.2394 +number, the effect is as if the number were a "1".
  4.2395 +
  4.2396 +<p>The UA must ignore leading and trailing whitespace in the attribute
  4.2397 +<var>X</var> and accept <span class="issue">only (or at least?)</span>
  4.2398 +decimal integers. Numbers less than 1 are interpreted as "1". <span
  4.2399 +class="issue">[Specify what we mean by "decimal integer"? Leading
  4.2400 +zeros? Ignore trailing garbage, as in "2rows" -&gt; "2"? Special rules
  4.2401 +for "0" or "*" to span as many rows/columns as possible?]</span>
  4.2402 +
  4.2403 +<p>A value of ''auto'' means that the UA should apply its built-in
  4.2404 +knowledge of the document format to determine the number of
  4.2405 +rows/columns to span, or assume "1" if it has no such knowledge.
  4.2406 +
  4.2407 +<p class="issue">[Relaxed conformance requirements for HTML?]
  4.2408 +
  4.2409 +<div class="example">
  4.2410 +<p>The following rules might be found in a UA style sheet for HTML or
  4.2411 +XHTML:
  4.2412 +
  4.2413 +<pre>
  4.2414 +td, th {
  4.2415 +  table-column-span: attr(colspan);
  4.2416 +  table-row-span: attr(rowspan) }
  4.2417 +</pre>
  4.2418 +</div>
  4.2419 +
  4.2420 +<p>The specified value is the computed value, i.e.,
  4.2421 +'attr(<var>X</var>)' is <em>not</em> replaced by the value of
  4.2422 +<var>X</var>.
  4.2423 +
  4.2424 +<p class="issue">In this proposal, 'col-span' and 'row-span' do not
  4.2425 +accept explicit numbers (&lt;<em>integer&gt;</em>), on the grounds
  4.2426 +that a table in the source is (at least in the ideal case) a
  4.2427 +structural element and the spans in it make structural sense.
  4.2428 +Therefore the spans can be used by CSS, but not changed. On the other
  4.2429 +hand, if you use CSS to display something as a table for visual
  4.2430 +purposes (e.g., to display a DL element as a 2-column table), it makes
  4.2431 +sense to allow certain elements to span columns or rows (e.g., a title
  4.2432 +across the top of the DL list).
  4.2433 +
  4.2434 +
  4.2435 +<h2>Aligning tables: 'table-baseline' property</h2>
  4.2436 +
  4.2437 +<!-- See CSS ftf 9-11 Oct 2006 -->
  4.2438 +
  4.2439 +<p class=issue>This property was decided during the CSS meeting of
  4.2440 +9&ndash;11 October 2006 in Mountain View on the request of George
  4.2441 +Chavchanidze. It can help align matrices and other table-like
  4.2442 +constructs in mathematics to the surrounding text.
  4.2443 +
  4.2444 +<table class=propdef>
  4.2445 +    <tr>
  4.2446 +      <td><em>Name:</em>
  4.2447 +      <td><dfn>table-baseline</dfn>
  4.2448 +    <tr>
  4.2449 +      <td><em>Value:</em>
  4.2450 +      <td><var>&lt;integer&gt;</var>
  4.2451 +    <tr>
  4.2452 +      <td><em>Initial:</em>
  4.2453 +      <td>1
  4.2454 +    <tr>
  4.2455 +      <td><em>Applies to:</em>
  4.2456 +      <td>tables and inline-tables
  4.2457 +    <tr>
  4.2458 +      <td><em>Inherited:</em>
  4.2459 +      <td>no
  4.2460 +    <tr>
  4.2461 +      <td><em>Percentages:</em>
  4.2462 +      <td>N/A
  4.2463 +    <tr>
  4.2464 +      <td><em>Media:</em>
  4.2465 +      <td>visual
  4.2466 +    <tr>
  4.2467 +      <td><em>Computed&nbsp;value:</em>
  4.2468 +      <td>specified value
  4.2469 +</table>
  4.2470 +
  4.2471 +<p>The property sets the baselines of the table for use by
  4.2472 +'vertical-align': If the value is <var>N</var>, the <dfn
  4.2473 +title="baseline of a table">baselines of the table</dfn> are the <em
  4.2474 +title="baseline of a row">baselines of the <var>N</var>th row.</em> If
  4.2475 +<var>N</var> is less than 1, use the first row; if <var>N</var> is
  4.2476 +greater than the number of rows, use the last row.
  4.2477 +
  4.2478 +<p>However, if 'vertical-align' is ''top'' or ''bottom'', the alignment is with respect to the top or bottom border edge of the table, not the row.
  4.2479 +
  4.2480 +<p class=note>Note that both inline (''inline-table'') and displayed
  4.2481 +(''table'') tables have a baseline. The latter is used, e.g., when a
  4.2482 +table is nested in another table's cell and has to be aligned to other
  4.2483 +cells in the same row.
  4.2484 +
  4.2485 +
  4.2486 +
  4.2487 +<div class=example>
  4.2488 +<p>The following example shows a 3×3 table that is aligned on the
  4.2489 +baseline of the middle row:
  4.2490 +
  4.2491 +<pre>
  4.2492 +&lt;p
  4.2493 +</pre>
  4.2494 +</div>
  4.2495 +
  4.2496 +
  4.2497 +<h2>Audio rendering of tables</h2>
  4.2498 +
  4.2499 +<p class=issue>Move this section to Speech module?
  4.2500 +
  4.2501 +<p>When a table is spoken by a speech generator, the relation between
  4.2502 +the data cells and the header cells must be expressed in a different
  4.2503 +way than by horizontal and vertical alignment. Some speech browsers
  4.2504 +may allow a user to move around in the 2-dimensional space, thus
  4.2505 +giving them the opportunity to map out the spatially represented
  4.2506 +relations. When that is not possible, the style sheet must specify at
  4.2507 +which points the headers are spoken.
  4.2508 +
  4.2509 +<h3 id="speak-headers">Speaking headers: the 'speak-header'
  4.2510 +property</h3>
  4.2511 +
  4.2512 +<table class=propdef>
  4.2513 +    <tr>
  4.2514 +      <td><em>Name:</em>
  4.2515 +      <td><dfn>speak-header</dfn>
  4.2516 +    <tr>
  4.2517 +      <td><em>Value:</em>
  4.2518 +      <td>once | always
  4.2519 +    <tr>
  4.2520 +      <td><em>Initial:</em>
  4.2521 +      <td>once
  4.2522 +    <tr>
  4.2523 +      <td><em>Applies to:</em>
  4.2524 +      <td>elements that have table header information
  4.2525 +    <tr>
  4.2526 +      <td><em>Inherited:</em>
  4.2527 +      <td>yes
  4.2528 +    <tr>
  4.2529 +      <td><em>Percentages:</em>
  4.2530 +      <td>N/A
  4.2531 +    <tr>
  4.2532 +      <td><em>Media:</em>
  4.2533 +      <td>aural
  4.2534 +    <tr>
  4.2535 +      <td><em>Computed&nbsp;value:</em>
  4.2536 +      <td>specified value
  4.2537 +</table>
  4.2538 +
  4.2539 +<p>This property specifies whether table headers are spoken before
  4.2540 +every cell, or only before a cell when that cell is associated with a
  4.2541 +different header than the previous cell. Values have the following
  4.2542 +meanings:
  4.2543 +
  4.2544 +<dl>
  4.2545 +  <dt>once <dd>The header is spoken one time, before a series of
  4.2546 +  cells.
  4.2547 +
  4.2548 +  <dt>always <dd>The header is spoken before every pertinent cell.
  4.2549 +</dl>
  4.2550 +
  4.2551 +<p>Each document language may have different mechanisms that allow
  4.2552 +authors to specify headers. For example, in HTML&nbsp;4 ([[HTML40]]),
  4.2553 +it is possible to specify header information with three different
  4.2554 +attributes ("headers", "scope", and "axis"), and the specification
  4.2555 +gives an algorithm for determining header information when these
  4.2556 +attributes have not been specified.
  4.2557 +
  4.2558 +<div class="html-example">
  4.2559 +
  4.2560 +<div class="figure">
  4.2561 +  <p><img src="table1.png" alt="Image of a table created in MS Word">
  4.2562 +
  4.2563 +  <p class="caption">Image of a table with header cells ("San Jose"
  4.2564 +  and "Seattle") that are not in the same column or row as the data
  4.2565 +  they apply to.
  4.2566 +</div>
  4.2567 +
  4.2568 +<p>This HTML example presents the money spent on meals, hotels and
  4.2569 +transport in two locations (San Jose and Seattle) for successive days.
  4.2570 +Conceptually, you can think of the table in terms of an n-dimensional
  4.2571 +space. The headers of this space are: location, day, category and
  4.2572 +sub-total. Some cells define marks along an axis while others give
  4.2573 +money spent at points within this space. The mark-up for this table
  4.2574 +is:
  4.2575 +
  4.2576 +<pre>
  4.2577 +&lt;TABLE&gt;
  4.2578 +&lt;CAPTION&gt;Travel Expense Report&lt;/CAPTION&gt;
  4.2579 +&lt;TR&gt;
  4.2580 +  &lt;TH&gt;&lt;/TH&gt;
  4.2581 +  &lt;TH&gt;Meals&lt;/TH&gt;
  4.2582 +  &lt;TH&gt;Hotels&lt;/TH&gt;
  4.2583 +  &lt;TH&gt;Transport&lt;/TH&gt;
  4.2584 +  &lt;TH&gt;sub-total&lt;/TH&gt;
  4.2585 +&lt;/TR&gt;
  4.2586 +&lt;TR&gt;
  4.2587 +  &lt;TH id="san-jose" axis="san-jose"&gt;San Jose&lt;/TH&gt;
  4.2588 +&lt;/TR&gt;
  4.2589 +&lt;TR&gt;
  4.2590 +  &lt;TH headers="san-jose"&gt;25-Aug-97&lt;/TH&gt;
  4.2591 +  &lt;TD&gt;37.74&lt;/TD&gt;
  4.2592 +  &lt;TD&gt;112.00&lt;/TD&gt;
  4.2593 +  &lt;TD&gt;45.00&lt;/TD&gt;
  4.2594 +  &lt;TD&gt;&lt;/TD&gt;
  4.2595 +&lt;/TR&gt;
  4.2596 +&lt;TR&gt;
  4.2597 +  &lt;TH headers="san-jose"&gt;26-Aug-97&lt;/TH&gt;
  4.2598 +  &lt;TD&gt;27.28&lt;/TD&gt;
  4.2599 +  &lt;TD&gt;112.00&lt;/TD&gt;
  4.2600 +  &lt;TD&gt;45.00&lt;/TD&gt;
  4.2601 +  &lt;TD&gt;&lt;/TD&gt;
  4.2602 +&lt;/TR&gt;
  4.2603 +&lt;TR&gt;
  4.2604 +  &lt;TH headers="san-jose"&gt;sub-total&lt;/TH&gt;
  4.2605 +  &lt;TD&gt;65.02&lt;/TD&gt;
  4.2606 +  &lt;TD&gt;224.00&lt;/TD&gt;
  4.2607 +  &lt;TD&gt;90.00&lt;/TD&gt;
  4.2608 +  &lt;TD&gt;379.02&lt;/TD&gt;
  4.2609 +&lt;/TR&gt;
  4.2610 +&lt;TR&gt;
  4.2611 +  &lt;TH id="seattle" axis="seattle"&gt;Seattle&lt;/TH&gt;
  4.2612 +&lt;/TR&gt;
  4.2613 +&lt;TR&gt;
  4.2614 +  &lt;TH headers="seattle"&gt;27-Aug-97&lt;/TH&gt;
  4.2615 +  &lt;TD&gt;96.25&lt;/TD&gt;
  4.2616 +  &lt;TD&gt;109.00&lt;/TD&gt;
  4.2617 +  &lt;TD&gt;36.00&lt;/TD&gt;
  4.2618 +  &lt;TD&gt;&lt;/TD&gt;
  4.2619 +&lt;/TR&gt;
  4.2620 +&lt;TR&gt;
  4.2621 +  &lt;TH headers="seattle"&gt;28-Aug-97&lt;/TH&gt;
  4.2622 +  &lt;TD&gt;35.00&lt;/TD&gt;
  4.2623 +  &lt;TD&gt;109.00&lt;/TD&gt;
  4.2624 +  &lt;TD&gt;36.00&lt;/TD&gt;
  4.2625 +  &lt;TD&gt;&lt;/TD&gt;
  4.2626 +&lt;/TR&gt;
  4.2627 +&lt;TR&gt;
  4.2628 +  &lt;TH headers="seattle"&gt;sub-total&lt;/TH&gt;
  4.2629 +  &lt;TD&gt;131.25&lt;/TD&gt;
  4.2630 +  &lt;TD&gt;218.00&lt;/TD&gt;
  4.2631 +  &lt;TD&gt;72.00&lt;/TD&gt;
  4.2632 +  &lt;TD&gt;421.25&lt;/TD&gt;
  4.2633 +&lt;/TR&gt;
  4.2634 +&lt;TR&gt;
  4.2635 +  &lt;TH&gt;Totals&lt;/TH&gt;
  4.2636 +  &lt;TD&gt;196.27&lt;/TD&gt;
  4.2637 +  &lt;TD&gt;442.00&lt;/TD&gt;
  4.2638 +  &lt;TD&gt;162.00&lt;/TD&gt;
  4.2639 +  &lt;TD&gt;800.27&lt;/TD&gt;
  4.2640 +&lt;/TR&gt;
  4.2641 +&lt;/TABLE&gt;
  4.2642 +</pre>
  4.2643 +
  4.2644 +<p>By providing the data model in this way, authors make it possible
  4.2645 +for speech enabled-browsers to explore the table in rich ways, e.g.,
  4.2646 +each cell could be spoken as a list, repeating the applicable headers
  4.2647 +before each data cell:
  4.2648 +
  4.2649 +<pre>
  4.2650 +San Jose, 25-Aug-97, Meals:  37.74
  4.2651 +San Jose, 25-Aug-97, Hotels:  112.00
  4.2652 +San Jose, 25-Aug-97, Transport:  45.00
  4.2653 +...
  4.2654 +</pre>
  4.2655 +
  4.2656 +<p>The browser could also speak the headers only when they change:
  4.2657 +
  4.2658 +<pre>
  4.2659 +San Jose, 25-Aug-97, Meals: 37.74
  4.2660 +    Hotels: 112.00
  4.2661 +    Transport: 45.00
  4.2662 +  26-Aug-97, Meals: 27.28
  4.2663 +    Hotels: 112.00
  4.2664 +...
  4.2665 +</pre>
  4.2666 +</div>
  4.2667 +
  4.2668 +<h2 class="no-num" id="acknowledgments">Acknowledgments</h2>
  4.2669 +
  4.2670 +<p>[acknowledgments]
  4.2671 +
  4.2672 +<h2 class="no-num" id="references">References</h2>
  4.2673 +
  4.2674 +<h3 class="no-num">Normative references</h3>
  4.2675 +<!--normative-->
  4.2676 +
  4.2677 +<h3 class="no-num">Other references</h3>
  4.2678 +<!--informative-->
  4.2679 +
  4.2680 +<h2 class="no-num">Index</h2>
  4.2681 +<!--index-->
  4.2682 +
  4.2683 +<h2 class="no-num" id="property-index">Property index</h2>
  4.2684 +<!-- properties -->
  4.2685 +
  4.2686 +<p>The following properties are defined in other modules: [Update when
  4.2687 +border and background are merged.]
  4.2688 +
  4.2689 +<ul>
  4.2690 +  <li><dfn>'background'</dfn> [[CSS3BG]]
  4.2691 +
  4.2692 +  <li><dfn>'border'</dfn>, <dfn>'border-style'</dfn>,
  4.2693 +  <dfn>'border-width'</dfn> [[CSS3BORDER]]
  4.2694 +
  4.2695 +  <li><dfn>'direction'</dfn>, <dfn>'text-align'</dfn> [[CSS3TEXT]]
  4.2696 +
  4.2697 +  <li><dfn>'display</dfn>, <dfn>'height'</dfn>, <dfn>'overflow'</dfn>,
  4.2698 +  <dfn>'width'</dfn> [[!CSS3BOX]]
  4.2699 +
  4.2700 +  <li><dfn>'vertical-align'</dfn> [[CSS3LINE]]
  4.2701 +
  4.2702 +  <li><dfn>'visibility'</dfn> [?]
  4.2703 +</ul>
  4.2704 +
  4.2705 +</body>
  4.2706 +</html>
  4.2707 +<!-- Keep this comment at the end of the file
  4.2708 +Local variables:
  4.2709 +mode:sgml
  4.2710 +sgml-declaration:"~/SGML/HTML4.decl"
  4.2711 +sgml-default-doctype-name:"html"
  4.2712 +sgml-minimize-attributes:t
  4.2713 +sgml-nofill-elements:("pre" "style" "br")
  4.2714 +sgml-live-element-indicator:t
  4.2715 +End:
  4.2716 +-->
  4.2717 + 
  4.2718 \ No newline at end of file

     5.1 Binary file css3-tables/bg.png has changed

     6.1 Binary file css3-tables/cell-align.png has changed

     7.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     7.2 +++ b/css3-tables/css-tabs.html	Fri Jan 11 16:51:55 2013 +0100
     7.3 @@ -0,0 +1,144 @@
     7.4 +<!doctype html public '-//W3C//DTD HTML BB//EN'>
     7.5 +<html>
     7.6 +<head>
     7.7 +<title>CSS tabs</title>
     7.8 +</head>
     7.9 +
    7.10 +<body>
    7.11 +<h1>CSS tabs</h1>
    7.12 +
    7.13 +<p>A proposal for adding tab stops to CSS.</p>
    7.14 +
    7.15 +<h4><a name="tab">'tab'</a></h4>
    7.16 +
    7.17 +<p><em>Value:</em> [ &lt;length&gt; | &lt;percentage&gt; | none ] [
    7.18 +dots | line | blank ]? [ l | r | c | d ]?<br> <em>Initial:</em> none
    7.19 +blank L<br> <em>Applies to:</em> inline
    7.20 +elements<br> <em>Inherited:</em> no<br>
    7.21 +<em>Percentage values:</em> relative to
    7.22 +element's width</p>
    7.23 +
    7.24 +<p>If an element has a tab property that doesn't start with 'none', it
    7.25 +means that the element is anchored to a certain horizontal position.
    7.26 +The four letters l, r, c, and d determine how it is anchored:</p>
    7.27 +
    7.28 +<ul>
    7.29 +<li><p>l means that the left edge of the element is at the indicated
    7.30 +position</p></li>
    7.31 +
    7.32 +<li><p>r means the right edge</p></li>
    7.33 +
    7.34 +<li><p>c means the element is centered on this position</p></li>
    7.35 +
    7.36 +<li><p>d means that the last occurrence of the decimal separator ('.'
    7.37 +in English) is centered at the indicated position. If there is no
    7.38 +decimal separator in the element, positioning is as with r.</p></li>
    7.39 +</ul>
    7.40 +
    7.41 +<p>The position can be given in any of the normal length units, or as
    7.42 +a percentage of the enclosing block element's width. Positive numbers
    7.43 +start from the left margin, negative ones from the right.</p>
    7.44 +
    7.45 +<p>Optionally, the space between the element and the preceding text
    7.46 +can be filled with a leader. The default is 'blank', meaning no leader
    7.47 +(i.e., just whitespace). 'dots' means that the space is filled with a
    7.48 +dot leader, 'line' means it is filled with a solid, horizontal
    7.49 +line.</p>
    7.50 +
    7.51 +<p>Here is an example of a table of contents. The HTML could be:</p>
    7.52 +
    7.53 +<pre>
    7.54 +&lt;B CLASS=toc-chp>1 The problem&lt;/B> &lt;span class="pgno">8&lt;/span>
    7.55 +&lt;EM CLASS=toc-sec>1.1 Definitions&lt;/EM> &lt;span class="pgno">9&lt;/span>
    7.56 +</pre>
    7.57 +
    7.58 +<p>With this style sheet:</p>
    7.59 +
    7.60 +<pre>
    7.61 +.toc-chp { tab: 0em /* default is left-align, no leaders */ }
    7.62 +.toc-sec { tab: 2em }
    7.63 +.pgno { tab: -0.001pt dots R }
    7.64 +</pre>
    7.65 +
    7.66 +<p>(The position for pgno must be negative; -0pt doesn't work.) The
    7.67 +result would be similar to this:</p>
    7.68 +
    7.69 +<pre>
    7.70 +1 The problem . . . . . . . . . 8
    7.71 +    1.1 Definitions . . . . . . 9
    7.72 +</pre>
    7.73 +
    7.74 +<p>Leaders are not considered part of the element, and thus they don't
    7.75 +use the font, color, decoration, etc. of the element itself, but of
    7.76 +its parent.</p>
    7.77 +
    7.78 +<p>An author can try to make sure that there is enough width by
    7.79 +setting the width property of the enclosing block to a fixed size, or
    7.80 +by selecting 'pre' or 'nowrap' for the block's whitespace property.
    7.81 +But even then there may be cases where the text doesn't fit in the
    7.82 +allocated columns (unavailable font sizes, different font metrics,
    7.83 +etc.). The following algorithm defines the behavior of tabs in such
    7.84 +cases.</p>
    7.85 +
    7.86 +<p>The first principle is: if the text of a tabbed element would
    7.87 +overlap the preceding text (or indeed appear visually <em>before</em>
    7.88 +the preceding text), the tab is moved to the next line. In some cases
    7.89 +the tab may have to be moved down several lines. (This can occur if
    7.90 +line wrapping is not disabled.)</p>
    7.91 +
    7.92 +<p>If line wrapping is disabled (whitespace set to 'pre' or 'nowrap'),
    7.93 +the width of the enclosing block element is automatically increased to
    7.94 +hold the longest line. However, the tab positions don't change: a
    7.95 +percentage value sets a tab at a position relative to the a-priori
    7.96 +width, based on the inherited width or the width property, if that has
    7.97 +been set explicitly.</p> 
    7.98 +
    7.99 +<p>If line wrapping is enabled (whitespace set to 'normal'), the
   7.100 +content of the element wraps when it reaches the margin (note that
   7.101 +this may be the right margin, the left margin or both). When it wraps,
   7.102 +the wrapped part should not be put at the opposite margin, but at the
   7.103 +tab position. An example with a left tab:</p>
   7.104 +
   7.105 +<pre>
   7.106 +  |>.......>.........|      <--- the margins (|) and the tabs (>)
   7.107 +  |                  |
   7.108 +  |>abc    >short    |      <--- the normal case
   7.109 +  |                  |
   7.110 +  |>def    >a longer |      <--- with wrapping
   7.111 +  |         element  |
   7.112 +  |         will wrap|
   7.113 +</pre>
   7.114 +
   7.115 +<p>An example with a right tab. Note how it wraps at the left margin
   7.116 +and at the tab position:</p>
   7.117 +
   7.118 +<pre>
   7.119 +  |....<.........<...|      <--- the margins (|) and the tabs (<)
   7.120 +  |                  |
   7.121 +  | abc<    short<   |      <--- the normal case
   7.122 +  |                  |
   7.123 +  | def<        a    |      <--- with wrapping
   7.124 +  |longer element    |
   7.125 +  |     will wrap<   |
   7.126 +</pre>
   7.127 +
   7.128 +
   7.129 +<hr>
   7.130 +<address>
   7.131 +<p><a href="../"><img src="../Icons/WWW/w3c_48x48" alt="W3C"></a><a href="../People/Bos">Bert Bos</a><br> <a href="../Help/Webmaster.html">Webmaster</a><br> Updated 20 Mar 1996,
   7.132 +27 Nov 1996</p>
   7.133 +</address></hr>
   7.134 +
   7.135 +</body>
   7.136 +</html>
   7.137 +
   7.138 +<!-- Keep this comment at the end of the file
   7.139 +Local variables:
   7.140 +mode: sgml
   7.141 +sgml-declaration:"~/SGML/html.decl"
   7.142 +sgml-default-doctype-name:"html"
   7.143 +sgml-minimize-attributes:t
   7.144 +sgml-nofill-elements:("pre" "style" "br")
   7.145 +sgml-live-element-indicator:t
   7.146 +End:
   7.147 +-->

     8.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     8.2 +++ b/css3-tables/left-caption.idraw	Fri Jan 11 16:51:55 2013 +0100
     8.3 @@ -0,0 +1,1056 @@
     8.4 +%!PS-Adobe-2.0 EPSF-1.2
     8.5 +%%DocumentFonts: Helvetica-Bold Times-Roman
     8.6 +%%Pages: 1
     8.7 +%%BoundingBox: 84 355 505 620
     8.8 +%%EndComments
     8.9 +
    8.10 +/IdrawDict 52 dict def
    8.11 +IdrawDict begin
    8.12 +
    8.13 +/reencodeISO {
    8.14 +dup dup findfont dup length dict begin
    8.15 +{ 1 index /FID ne { def }{ pop pop } ifelse } forall
    8.16 +/Encoding ISOLatin1Encoding def
    8.17 +currentdict end definefont
    8.18 +} def
    8.19 +
    8.20 +/ISOLatin1Encoding [
    8.21 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
    8.22 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
    8.23 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
    8.24 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
    8.25 +/space/exclam/quotedbl/numbersign/dollar/percent/ampersand/quoteright
    8.26 +/parenleft/parenright/asterisk/plus/comma/minus/period/slash
    8.27 +/zero/one/two/three/four/five/six/seven/eight/nine/colon/semicolon
    8.28 +/less/equal/greater/question/at/A/B/C/D/E/F/G/H/I/J/K/L/M/N
    8.29 +/O/P/Q/R/S/T/U/V/W/X/Y/Z/bracketleft/backslash/bracketright
    8.30 +/asciicircum/underscore/quoteleft/a/b/c/d/e/f/g/h/i/j/k/l/m
    8.31 +/n/o/p/q/r/s/t/u/v/w/x/y/z/braceleft/bar/braceright/asciitilde
    8.32 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
    8.33 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
    8.34 +/.notdef/dotlessi/grave/acute/circumflex/tilde/macron/breve
    8.35 +/dotaccent/dieresis/.notdef/ring/cedilla/.notdef/hungarumlaut
    8.36 +/ogonek/caron/space/exclamdown/cent/sterling/currency/yen/brokenbar
    8.37 +/section/dieresis/copyright/ordfeminine/guillemotleft/logicalnot
    8.38 +/hyphen/registered/macron/degree/plusminus/twosuperior/threesuperior
    8.39 +/acute/mu/paragraph/periodcentered/cedilla/onesuperior/ordmasculine
    8.40 +/guillemotright/onequarter/onehalf/threequarters/questiondown
    8.41 +/Agrave/Aacute/Acircumflex/Atilde/Adieresis/Aring/AE/Ccedilla
    8.42 +/Egrave/Eacute/Ecircumflex/Edieresis/Igrave/Iacute/Icircumflex
    8.43 +/Idieresis/Eth/Ntilde/Ograve/Oacute/Ocircumflex/Otilde/Odieresis
    8.44 +/multiply/Oslash/Ugrave/Uacute/Ucircumflex/Udieresis/Yacute
    8.45 +/Thorn/germandbls/agrave/aacute/acircumflex/atilde/adieresis
    8.46 +/aring/ae/ccedilla/egrave/eacute/ecircumflex/edieresis/igrave
    8.47 +/iacute/icircumflex/idieresis/eth/ntilde/ograve/oacute/ocircumflex
    8.48 +/otilde/odieresis/divide/oslash/ugrave/uacute/ucircumflex/udieresis
    8.49 +/yacute/thorn/ydieresis
    8.50 +] def
    8.51 +/Helvetica-Bold reencodeISO def
    8.52 +/Times-Roman reencodeISO def
    8.53 +
    8.54 +/arrowHeight 8 def
    8.55 +/arrowWidth 4 def
    8.56 +/none null def
    8.57 +/numGraphicParameters 17 def
    8.58 +/stringLimit 65535 def
    8.59 +
    8.60 +/Begin {
    8.61 +save
    8.62 +numGraphicParameters dict begin
    8.63 +} def
    8.64 +
    8.65 +/End {
    8.66 +end
    8.67 +restore
    8.68 +} def
    8.69 +
    8.70 +/SetB {
    8.71 +dup type /nulltype eq {
    8.72 +pop
    8.73 +false /brushRightArrow idef
    8.74 +false /brushLeftArrow idef
    8.75 +true /brushNone idef
    8.76 +} {
    8.77 +/brushDashOffset idef
    8.78 +/brushDashArray idef
    8.79 +0 ne /brushRightArrow idef
    8.80 +0 ne /brushLeftArrow idef
    8.81 +/brushWidth idef
    8.82 +false /brushNone idef
    8.83 +} ifelse
    8.84 +} def
    8.85 +
    8.86 +/SetCFg {
    8.87 +/fgblue idef
    8.88 +/fggreen idef
    8.89 +/fgred idef
    8.90 +} def
    8.91 +
    8.92 +/SetCBg {
    8.93 +/bgblue idef
    8.94 +/bggreen idef
    8.95 +/bgred idef
    8.96 +} def
    8.97 +
    8.98 +/SetF {
    8.99 +/printSize idef
   8.100 +/printFont idef
   8.101 +} def
   8.102 +
   8.103 +/SetP {
   8.104 +dup type /nulltype eq {
   8.105 +pop true /patternNone idef
   8.106 +} {
   8.107 +dup -1 eq {
   8.108 +/patternGrayLevel idef
   8.109 +/patternString idef
   8.110 +} {
   8.111 +/patternGrayLevel idef
   8.112 +} ifelse
   8.113 +false /patternNone idef
   8.114 +} ifelse
   8.115 +} def
   8.116 +
   8.117 +/BSpl {
   8.118 +0 begin
   8.119 +storexyn
   8.120 +newpath
   8.121 +n 1 gt {
   8.122 +0 0 0 0 0 0 1 1 true subspline
   8.123 +n 2 gt {
   8.124 +0 0 0 0 1 1 2 2 false subspline
   8.125 +1 1 n 3 sub {
   8.126 +/i exch def
   8.127 +i 1 sub dup i dup i 1 add dup i 2 add dup false subspline
   8.128 +} for
   8.129 +n 3 sub dup n 2 sub dup n 1 sub dup 2 copy false subspline
   8.130 +} if
   8.131 +n 2 sub dup n 1 sub dup 2 copy 2 copy false subspline
   8.132 +patternNone not brushLeftArrow not brushRightArrow not and and { ifill } if
   8.133 +brushNone not { istroke } if
   8.134 +0 0 1 1 leftarrow
   8.135 +n 2 sub dup n 1 sub dup rightarrow
   8.136 +} if
   8.137 +end
   8.138 +} dup 0 4 dict put def
   8.139 +
   8.140 +/Circ {
   8.141 +newpath
   8.142 +0 360 arc
   8.143 +patternNone not { ifill } if
   8.144 +brushNone not { istroke } if
   8.145 +} def
   8.146 +
   8.147 +/CBSpl {
   8.148 +0 begin
   8.149 +dup 2 gt {
   8.150 +storexyn
   8.151 +newpath
   8.152 +n 1 sub dup 0 0 1 1 2 2 true subspline
   8.153 +1 1 n 3 sub {
   8.154 +/i exch def
   8.155 +i 1 sub dup i dup i 1 add dup i 2 add dup false subspline
   8.156 +} for
   8.157 +n 3 sub dup n 2 sub dup n 1 sub dup 0 0 false subspline
   8.158 +n 2 sub dup n 1 sub dup 0 0 1 1 false subspline
   8.159 +patternNone not { ifill } if
   8.160 +brushNone not { istroke } if
   8.161 +} {
   8.162 +Poly
   8.163 +} ifelse
   8.164 +end
   8.165 +} dup 0 4 dict put def
   8.166 +
   8.167 +/Elli {
   8.168 +0 begin
   8.169 +newpath
   8.170 +4 2 roll
   8.171 +translate
   8.172 +scale
   8.173 +0 0 1 0 360 arc
   8.174 +patternNone not { ifill } if
   8.175 +brushNone not { istroke } if
   8.176 +end
   8.177 +} dup 0 1 dict put def
   8.178 +
   8.179 +/Line {
   8.180 +0 begin
   8.181 +2 storexyn
   8.182 +newpath
   8.183 +x 0 get y 0 get moveto
   8.184 +x 1 get y 1 get lineto
   8.185 +brushNone not { istroke } if
   8.186 +0 0 1 1 leftarrow
   8.187 +0 0 1 1 rightarrow
   8.188 +end
   8.189 +} dup 0 4 dict put def
   8.190 +
   8.191 +/MLine {
   8.192 +0 begin
   8.193 +storexyn
   8.194 +newpath
   8.195 +n 1 gt {
   8.196 +x 0 get y 0 get moveto
   8.197 +1 1 n 1 sub {
   8.198 +/i exch def
   8.199 +x i get y i get lineto
   8.200 +} for
   8.201 +patternNone not brushLeftArrow not brushRightArrow not and and { ifill } if
   8.202 +brushNone not { istroke } if
   8.203 +0 0 1 1 leftarrow
   8.204 +n 2 sub dup n 1 sub dup rightarrow
   8.205 +} if
   8.206 +end
   8.207 +} dup 0 4 dict put def
   8.208 +
   8.209 +/Poly {
   8.210 +3 1 roll
   8.211 +newpath
   8.212 +moveto
   8.213 +-1 add
   8.214 +{ lineto } repeat
   8.215 +closepath
   8.216 +patternNone not { ifill } if
   8.217 +brushNone not { istroke } if
   8.218 +} def
   8.219 +
   8.220 +/Rect {
   8.221 +0 begin
   8.222 +/t exch def
   8.223 +/r exch def
   8.224 +/b exch def
   8.225 +/l exch def
   8.226 +newpath
   8.227 +l b moveto
   8.228 +l t lineto
   8.229 +r t lineto
   8.230 +r b lineto
   8.231 +closepath
   8.232 +patternNone not { ifill } if
   8.233 +brushNone not { istroke } if
   8.234 +end
   8.235 +} dup 0 4 dict put def
   8.236 +
   8.237 +/Text {
   8.238 +ishow
   8.239 +} def
   8.240 +
   8.241 +/idef {
   8.242 +dup where { pop pop pop } { exch def } ifelse
   8.243 +} def
   8.244 +
   8.245 +/ifill {
   8.246 +0 begin
   8.247 +gsave
   8.248 +patternGrayLevel -1 ne {
   8.249 +fgred bgred fgred sub patternGrayLevel mul add
   8.250 +fggreen bggreen fggreen sub patternGrayLevel mul add
   8.251 +fgblue bgblue fgblue sub patternGrayLevel mul add setrgbcolor
   8.252 +eofill
   8.253 +} {
   8.254 +eoclip
   8.255 +originalCTM setmatrix
   8.256 +pathbbox /t exch def /r exch def /b exch def /l exch def
   8.257 +/w r l sub ceiling cvi def
   8.258 +/h t b sub ceiling cvi def
   8.259 +/imageByteWidth w 8 div ceiling cvi def
   8.260 +/imageHeight h def
   8.261 +bgred bggreen bgblue setrgbcolor
   8.262 +eofill
   8.263 +fgred fggreen fgblue setrgbcolor
   8.264 +w 0 gt h 0 gt and {
   8.265 +l b translate w h scale
   8.266 +w h true [w 0 0 h neg 0 h] { patternproc } imagemask
   8.267 +} if
   8.268 +} ifelse
   8.269 +grestore
   8.270 +end
   8.271 +} dup 0 8 dict put def
   8.272 +
   8.273 +/istroke {
   8.274 +gsave
   8.275 +brushDashOffset -1 eq {
   8.276 +[] 0 setdash
   8.277 +1 setgray
   8.278 +} {
   8.279 +brushDashArray brushDashOffset setdash
   8.280 +fgred fggreen fgblue setrgbcolor
   8.281 +} ifelse
   8.282 +brushWidth setlinewidth
   8.283 +originalCTM setmatrix
   8.284 +stroke
   8.285 +grestore
   8.286 +} def
   8.287 +
   8.288 +/ishow {
   8.289 +0 begin
   8.290 +gsave
   8.291 +fgred fggreen fgblue setrgbcolor
   8.292 +printFont printSize scalefont setfont
   8.293 +/descender 0 printFont /FontBBox get 1 get printFont /FontMatrix
   8.294 +get transform exch pop def
   8.295 +/vertoffset 1 printSize sub descender sub def {
   8.296 +0 vertoffset moveto show
   8.297 +/vertoffset vertoffset printSize sub def
   8.298 +} forall
   8.299 +grestore
   8.300 +end
   8.301 +} dup 0 2 dict put def
   8.302 +
   8.303 +/patternproc {
   8.304 +0 begin
   8.305 +/patternByteLength patternString length def
   8.306 +/patternHeight patternByteLength 8 mul sqrt cvi def
   8.307 +/patternWidth patternHeight def
   8.308 +/patternByteWidth patternWidth 8 idiv def
   8.309 +/imageByteMaxLength imageByteWidth imageHeight mul
   8.310 +stringLimit patternByteWidth sub min def
   8.311 +/imageMaxHeight imageByteMaxLength imageByteWidth idiv patternHeight idiv
   8.312 +patternHeight mul patternHeight max def
   8.313 +/imageHeight imageHeight imageMaxHeight sub store
   8.314 +/imageString imageByteWidth imageMaxHeight mul patternByteWidth add string def
   8.315 +0 1 imageMaxHeight 1 sub {
   8.316 +/y exch def
   8.317 +/patternRow y patternByteWidth mul patternByteLength mod def
   8.318 +/patternRowString patternString patternRow patternByteWidth getinterval def
   8.319 +/imageRow y imageByteWidth mul def
   8.320 +0 patternByteWidth imageByteWidth 1 sub {
   8.321 +/x exch def
   8.322 +imageString imageRow x add patternRowString putinterval
   8.323 +} for
   8.324 +} for
   8.325 +imageString
   8.326 +end
   8.327 +} dup 0 12 dict put def
   8.328 +
   8.329 +/min {
   8.330 +dup 3 2 roll dup 4 3 roll lt { exch } if pop
   8.331 +} def
   8.332 +
   8.333 +/max {
   8.334 +dup 3 2 roll dup 4 3 roll gt { exch } if pop
   8.335 +} def
   8.336 +
   8.337 +/arrowhead {
   8.338 +0 begin
   8.339 +transform originalCTM itransform
   8.340 +/taily exch def
   8.341 +/tailx exch def
   8.342 +transform originalCTM itransform
   8.343 +/tipy exch def
   8.344 +/tipx exch def
   8.345 +/dy tipy taily sub def
   8.346 +/dx tipx tailx sub def
   8.347 +/angle dx 0 ne dy 0 ne or { dy dx atan } { 90 } ifelse def
   8.348 +gsave
   8.349 +originalCTM setmatrix
   8.350 +tipx tipy translate
   8.351 +angle rotate
   8.352 +newpath
   8.353 +0 0 moveto
   8.354 +arrowHeight neg arrowWidth 2 div lineto
   8.355 +arrowHeight neg arrowWidth 2 div neg lineto
   8.356 +closepath
   8.357 +patternNone not {
   8.358 +originalCTM setmatrix
   8.359 +/padtip arrowHeight 2 exp 0.25 arrowWidth 2 exp mul add sqrt brushWidth mul
   8.360 +arrowWidth div def
   8.361 +/padtail brushWidth 2 div def
   8.362 +tipx tipy translate
   8.363 +angle rotate
   8.364 +padtip 0 translate
   8.365 +arrowHeight padtip add padtail add arrowHeight div dup scale
   8.366 +arrowheadpath
   8.367 +ifill
   8.368 +} if
   8.369 +brushNone not {
   8.370 +originalCTM setmatrix
   8.371 +tipx tipy translate
   8.372 +angle rotate
   8.373 +arrowheadpath
   8.374 +istroke
   8.375 +} if
   8.376 +grestore
   8.377 +end
   8.378 +} dup 0 9 dict put def
   8.379 +
   8.380 +/arrowheadpath {
   8.381 +newpath
   8.382 +0 0 moveto
   8.383 +arrowHeight neg arrowWidth 2 div lineto
   8.384 +arrowHeight neg arrowWidth 2 div neg lineto
   8.385 +closepath
   8.386 +} def
   8.387 +
   8.388 +/leftarrow {
   8.389 +0 begin
   8.390 +y exch get /taily exch def
   8.391 +x exch get /tailx exch def
   8.392 +y exch get /tipy exch def
   8.393 +x exch get /tipx exch def
   8.394 +brushLeftArrow { tipx tipy tailx taily arrowhead } if
   8.395 +end
   8.396 +} dup 0 4 dict put def
   8.397 +
   8.398 +/rightarrow {
   8.399 +0 begin
   8.400 +y exch get /tipy exch def
   8.401 +x exch get /tipx exch def
   8.402 +y exch get /taily exch def
   8.403 +x exch get /tailx exch def
   8.404 +brushRightArrow { tipx tipy tailx taily arrowhead } if
   8.405 +end
   8.406 +} dup 0 4 dict put def
   8.407 +
   8.408 +/midpoint {
   8.409 +0 begin
   8.410 +/y1 exch def
   8.411 +/x1 exch def
   8.412 +/y0 exch def
   8.413 +/x0 exch def
   8.414 +x0 x1 add 2 div
   8.415 +y0 y1 add 2 div
   8.416 +end
   8.417 +} dup 0 4 dict put def
   8.418 +
   8.419 +/thirdpoint {
   8.420 +0 begin
   8.421 +/y1 exch def
   8.422 +/x1 exch def
   8.423 +/y0 exch def
   8.424 +/x0 exch def
   8.425 +x0 2 mul x1 add 3 div
   8.426 +y0 2 mul y1 add 3 div
   8.427 +end
   8.428 +} dup 0 4 dict put def
   8.429 +
   8.430 +/subspline {
   8.431 +0 begin
   8.432 +/movetoNeeded exch def
   8.433 +y exch get /y3 exch def
   8.434 +x exch get /x3 exch def
   8.435 +y exch get /y2 exch def
   8.436 +x exch get /x2 exch def
   8.437 +y exch get /y1 exch def
   8.438 +x exch get /x1 exch def
   8.439 +y exch get /y0 exch def
   8.440 +x exch get /x0 exch def
   8.441 +x1 y1 x2 y2 thirdpoint
   8.442 +/p1y exch def
   8.443 +/p1x exch def
   8.444 +x2 y2 x1 y1 thirdpoint
   8.445 +/p2y exch def
   8.446 +/p2x exch def
   8.447 +x1 y1 x0 y0 thirdpoint
   8.448 +p1x p1y midpoint
   8.449 +/p0y exch def
   8.450 +/p0x exch def
   8.451 +x2 y2 x3 y3 thirdpoint
   8.452 +p2x p2y midpoint
   8.453 +/p3y exch def
   8.454 +/p3x exch def
   8.455 +movetoNeeded { p0x p0y moveto } if
   8.456 +p1x p1y p2x p2y p3x p3y curveto
   8.457 +end
   8.458 +} dup 0 17 dict put def
   8.459 +
   8.460 +/storexyn {
   8.461 +/n exch def
   8.462 +/y n array def
   8.463 +/x n array def
   8.464 +n 1 sub -1 0 {
   8.465 +/i exch def
   8.466 +y i 3 2 roll put
   8.467 +x i 3 2 roll put
   8.468 +} for
   8.469 +} def
   8.470 +
   8.471 +%%EndProlog
   8.472 +
   8.473 +%I Idraw 9 Grid 4 
   8.474 +
   8.475 +%%Page: 1 1
   8.476 +
   8.477 +Begin
   8.478 +%I b u
   8.479 +%I cfg u
   8.480 +%I cbg u
   8.481 +%I f u
   8.482 +%I p u
   8.483 +%I t
   8.484 +[ 0.8 0 0 0.8 0 0 ] concat
   8.485 +/originalCTM matrix currentmatrix def
   8.486 +
   8.487 +Begin %I Line
   8.488 +%I b 13107
   8.489 +1 0 0 [2 2 2 2 2 2 2 2] 15 SetB
   8.490 +%I cfg LtGray
   8.491 +0 0 0 SetCFg
   8.492 +%I cbg White
   8.493 +1 1 1 SetCBg
   8.494 +%I p
   8.495 +0 SetP
   8.496 +%I t
   8.497 +[ 1 0 0 1 148 197 ] concat
   8.498 +%I
   8.499 +61 500 61 251 Line
   8.500 +End
   8.501 +
   8.502 +Begin %I Line
   8.503 +%I b 13107
   8.504 +1 0 0 [2 2 2 2 2 2 2 2] 15 SetB
   8.505 +%I cfg LtGray
   8.506 +0 0 0 SetCFg
   8.507 +%I cbg White
   8.508 +1 1 1 SetCBg
   8.509 +%I p
   8.510 +0 SetP
   8.511 +%I t
   8.512 +[ 1 0 0 1 208 197 ] concat
   8.513 +%I
   8.514 +320 500 320 251 Line
   8.515 +End
   8.516 +
   8.517 +Begin %I Line
   8.518 +%I b 65535
   8.519 +1 1 0 [] 0 SetB
   8.520 +%I cfg Black
   8.521 +0 0 0 SetCFg
   8.522 +%I cbg White
   8.523 +1 1 1 SetCBg
   8.524 +%I p
   8.525 +0 SetP
   8.526 +%I t
   8.527 +[ 1 0 0 1 148 197 ] concat
   8.528 +%I
   8.529 +61 510 141 550 Line
   8.530 +End
   8.531 +
   8.532 +Begin %I Line
   8.533 +%I b 65535
   8.534 +1 1 0 [] 0 SetB
   8.535 +%I cfg Black
   8.536 +0 0 0 SetCFg
   8.537 +%I cbg White
   8.538 +1 1 1 SetCBg
   8.539 +%I p
   8.540 +0 SetP
   8.541 +%I t
   8.542 +[ 0.975393 0 0 0.76258 154.41 327.509 ] concat
   8.543 +%I
   8.544 +380 500 141 550 Line
   8.545 +End
   8.546 +
   8.547 +Begin %I Text
   8.548 +%I cfg Black
   8.549 +0 0 0 SetCFg
   8.550 +%I f *-helvetica-bold-r-*-140-*
   8.551 +Helvetica-Bold 14 SetF
   8.552 +%I t
   8.553 +[ 1 0 0 1 299 767 ] concat
   8.554 +%I
   8.555 +[
   8.556 +(current margins)
   8.557 +] Text
   8.558 +End
   8.559 +
   8.560 +Begin %I Text
   8.561 +%I cfg Black
   8.562 +0 0 0 SetCFg
   8.563 +%I f *-times-medium-r-*-120-*
   8.564 +Times-Roman 12 SetF
   8.565 +%I t
   8.566 +[ 1 0 0 1 209 658 ] concat
   8.567 +%I
   8.568 +[
   8.569 +(text text text previous paragraph text text above the table text text)
   8.570 +(more text text text normal paragraph text text etc. etc.)
   8.571 +] Text
   8.572 +End
   8.573 +
   8.574 +Begin %I Line
   8.575 +%I b 65535
   8.576 +1 0 0 [] 0 SetB
   8.577 +%I cfg Black
   8.578 +0 0 0 SetCFg
   8.579 +%I cbg White
   8.580 +1 1 1 SetCBg
   8.581 +none SetP %I p n
   8.582 +%I t
   8.583 +[ 1 0 0 0.923077 148 226.385 ] concat
   8.584 +%I
   8.585 +121 370 320 370 Line
   8.586 +End
   8.587 +
   8.588 +Begin %I Line
   8.589 +%I b 65535
   8.590 +1 0 0 [] 0 SetB
   8.591 +%I cfg Black
   8.592 +0 0 0 SetCFg
   8.593 +%I cbg White
   8.594 +1 1 1 SetCBg
   8.595 +none SetP %I p n
   8.596 +%I t
   8.597 +[ 1 0 0 1 148 197 ] concat
   8.598 +%I
   8.599 +121 311 320 311 Line
   8.600 +End
   8.601 +
   8.602 +Begin %I Line
   8.603 +%I b 65535
   8.604 +1 0 0 [] 0 SetB
   8.605 +%I cfg Black
   8.606 +0 0 0 SetCFg
   8.607 +%I cbg White
   8.608 +1 1 1 SetCBg
   8.609 +none SetP %I p n
   8.610 +%I t
   8.611 +[ 1 0 0 1 148 197 ] concat
   8.612 +%I
   8.613 +171 411 171 271 Line
   8.614 +End
   8.615 +
   8.616 +Begin %I Line
   8.617 +%I b 65535
   8.618 +1 0 0 [] 0 SetB
   8.619 +%I cfg Black
   8.620 +0 0 0 SetCFg
   8.621 +%I cbg White
   8.622 +1 1 1 SetCBg
   8.623 +none SetP %I p n
   8.624 +%I t
   8.625 +[ 1 0 0 1 148 197 ] concat
   8.626 +%I
   8.627 +251 411 251 271 Line
   8.628 +End
   8.629 +
   8.630 +Begin %I Line
   8.631 +%I b 65535
   8.632 +1 0 0 [] 0 SetB
   8.633 +%I cfg Black
   8.634 +0 0 0 SetCFg
   8.635 +%I cbg White
   8.636 +1 1 1 SetCBg
   8.637 +none SetP %I p n
   8.638 +%I t
   8.639 +[ 1 0 0 1 148 197 ] concat
   8.640 +%I
   8.641 +121 391 320 391 Line
   8.642 +End
   8.643 +
   8.644 +Begin %I Line
   8.645 +%I b 65535
   8.646 +1 0 0 [] 0 SetB
   8.647 +%I cfg Black
   8.648 +0 0 0 SetCFg
   8.649 +%I cbg White
   8.650 +1 1 1 SetCBg
   8.651 +none SetP %I p n
   8.652 +%I t
   8.653 +[ 1 0 0 1 148 197 ] concat
   8.654 +%I
   8.655 +121 351 320 351 Line
   8.656 +End
   8.657 +
   8.658 +Begin %I Line
   8.659 +%I b 65535
   8.660 +1 0 0 [] 0 SetB
   8.661 +%I cfg Black
   8.662 +0 0 0 SetCFg
   8.663 +%I cbg White
   8.664 +1 1 1 SetCBg
   8.665 +none SetP %I p n
   8.666 +%I t
   8.667 +[ 1 0 0 1 148 197 ] concat
   8.668 +%I
   8.669 +121 331 320 331 Line
   8.670 +End
   8.671 +
   8.672 +Begin %I Line
   8.673 +%I b 65535
   8.674 +1 0 0 [] 0 SetB
   8.675 +%I cfg Black
   8.676 +0 0 0 SetCFg
   8.677 +%I cbg White
   8.678 +1 1 1 SetCBg
   8.679 +none SetP %I p n
   8.680 +%I t
   8.681 +[ 1 0 0 1 148 197 ] concat
   8.682 +%I
   8.683 +121 291 320 291 Line
   8.684 +End
   8.685 +
   8.686 +Begin %I Rect
   8.687 +%I b 65535
   8.688 +1 0 0 [] 0 SetB
   8.689 +%I cfg Black
   8.690 +0 0 0 SetCFg
   8.691 +%I cbg White
   8.692 +1 1 1 SetCBg
   8.693 +none SetP %I p n
   8.694 +%I t
   8.695 +[ 1 0 0 1 148 197 ] concat
   8.696 +%I
   8.697 +121 271 320 411 Rect
   8.698 +End
   8.699 +
   8.700 +Begin %I Text
   8.701 +%I cfg Black
   8.702 +0 0 0 SetCFg
   8.703 +%I f *-times-medium-r-*-120-*
   8.704 +Times-Roman 12 SetF
   8.705 +%I t
   8.706 +[ 1 0 0 1 139 538 ] concat
   8.707 +%I
   8.708 +[
   8.709 +(Table 72. This)
   8.710 +] Text
   8.711 +End
   8.712 +
   8.713 +Begin %I Text
   8.714 +%I cfg Black
   8.715 +0 0 0 SetCFg
   8.716 +%I f *-times-medium-r-*-120-*
   8.717 +Times-Roman 12 SetF
   8.718 +%I t
   8.719 +[ 1 0 0 1 132 523 ] concat
   8.720 +%I
   8.721 +[
   8.722 +(is the caption. It)
   8.723 +()
   8.724 +] Text
   8.725 +End
   8.726 +
   8.727 +Begin %I Text
   8.728 +%I cfg Black
   8.729 +0 0 0 SetCFg
   8.730 +%I f *-times-medium-r-*-120-*
   8.731 +Times-Roman 12 SetF
   8.732 +%I t
   8.733 +[ 1 0 0 1 134 508 ] concat
   8.734 +%I
   8.735 +[
   8.736 +(is right aligned.)
   8.737 +] Text
   8.738 +End
   8.739 +
   8.740 +Begin %I Text
   8.741 +%I cfg Black
   8.742 +0 0 0 SetCFg
   8.743 +%I f *-times-medium-r-*-120-*
   8.744 +Times-Roman 12 SetF
   8.745 +%I t
   8.746 +[ 1 0 0 1 119 493 ] concat
   8.747 +%I
   8.748 +[
   8.749 +(Also aligned at the)
   8.750 +] Text
   8.751 +End
   8.752 +
   8.753 +Begin %I Text
   8.754 +%I cfg Black
   8.755 +0 0 0 SetCFg
   8.756 +%I f *-times-medium-r-*-120-*
   8.757 +Times-Roman 12 SetF
   8.758 +%I t
   8.759 +[ 1 0 0 1 174 478 ] concat
   8.760 +%I
   8.761 +[
   8.762 +(bottom)
   8.763 +] Text
   8.764 +End
   8.765 +
   8.766 +Begin %I Text
   8.767 +%I cfg Black
   8.768 +0 0 0 SetCFg
   8.769 +%I f *-times-medium-r-*-120-*
   8.770 +Times-Roman 12 SetF
   8.771 +%I t
   8.772 +[ 1 0 0 1 279 603 ] concat
   8.773 +%I
   8.774 +[
   8.775 +(header)
   8.776 +] Text
   8.777 +End
   8.778 +
   8.779 +Begin %I Text
   8.780 +%I cfg Black
   8.781 +0 0 0 SetCFg
   8.782 +%I f *-times-medium-r-*-120-*
   8.783 +Times-Roman 12 SetF
   8.784 +%I t
   8.785 +[ 1 0 0 1 329 603 ] concat
   8.786 +%I
   8.787 +[
   8.788 +(header)
   8.789 +] Text
   8.790 +End
   8.791 +
   8.792 +Begin %I Text
   8.793 +%I cfg Black
   8.794 +0 0 0 SetCFg
   8.795 +%I f *-times-medium-r-*-120-*
   8.796 +Times-Roman 12 SetF
   8.797 +%I t
   8.798 +[ 1 0 0 1 408 603 ] concat
   8.799 +%I
   8.800 +[
   8.801 +(header)
   8.802 +] Text
   8.803 +End
   8.804 +
   8.805 +Begin %I Text
   8.806 +%I cfg Black
   8.807 +0 0 0 SetCFg
   8.808 +%I f *-times-medium-r-*-120-*
   8.809 +Times-Roman 12 SetF
   8.810 +%I t
   8.811 +[ 1 0 0 1 279 583 ] concat
   8.812 +%I
   8.813 +[
   8.814 +(cell)
   8.815 +] Text
   8.816 +End
   8.817 +
   8.818 +Begin %I Text
   8.819 +%I cfg Black
   8.820 +0 0 0 SetCFg
   8.821 +%I f *-times-medium-r-*-120-*
   8.822 +Times-Roman 12 SetF
   8.823 +%I t
   8.824 +[ 1 0 0 1 279 563 ] concat
   8.825 +%I
   8.826 +[
   8.827 +(cell)
   8.828 +] Text
   8.829 +End
   8.830 +
   8.831 +Begin %I Text
   8.832 +%I cfg Black
   8.833 +0 0 0 SetCFg
   8.834 +%I f *-times-medium-r-*-120-*
   8.835 +Times-Roman 12 SetF
   8.836 +%I t
   8.837 +[ 1 0 0 1 279 543 ] concat
   8.838 +%I
   8.839 +[
   8.840 +(cell)
   8.841 +] Text
   8.842 +End
   8.843 +
   8.844 +Begin %I Text
   8.845 +%I cfg Black
   8.846 +0 0 0 SetCFg
   8.847 +%I f *-times-medium-r-*-120-*
   8.848 +Times-Roman 12 SetF
   8.849 +%I t
   8.850 +[ 1 0 0 1 279 523 ] concat
   8.851 +%I
   8.852 +[
   8.853 +(cell)
   8.854 +] Text
   8.855 +End
   8.856 +
   8.857 +Begin %I Text
   8.858 +%I cfg Black
   8.859 +0 0 0 SetCFg
   8.860 +%I f *-times-medium-r-*-120-*
   8.861 +Times-Roman 12 SetF
   8.862 +%I t
   8.863 +[ 1 0 0 1 279 503 ] concat
   8.864 +%I
   8.865 +[
   8.866 +(cell)
   8.867 +] Text
   8.868 +End
   8.869 +
   8.870 +Begin %I Text
   8.871 +%I cfg Black
   8.872 +0 0 0 SetCFg
   8.873 +%I f *-times-medium-r-*-120-*
   8.874 +Times-Roman 12 SetF
   8.875 +%I t
   8.876 +[ 1 0 0 1 279 483 ] concat
   8.877 +%I
   8.878 +[
   8.879 +(cell)
   8.880 +] Text
   8.881 +End
   8.882 +
   8.883 +Begin %I Text
   8.884 +%I cfg Black
   8.885 +0 0 0 SetCFg
   8.886 +%I f *-times-medium-r-*-120-*
   8.887 +Times-Roman 12 SetF
   8.888 +%I t
   8.889 +[ 1 0 0 1 329 483 ] concat
   8.890 +%I
   8.891 +[
   8.892 +(cell)
   8.893 +] Text
   8.894 +End
   8.895 +
   8.896 +Begin %I Text
   8.897 +%I cfg Black
   8.898 +0 0 0 SetCFg
   8.899 +%I f *-times-medium-r-*-120-*
   8.900 +Times-Roman 12 SetF
   8.901 +%I t
   8.902 +[ 1 0 0 1 329 503 ] concat
   8.903 +%I
   8.904 +[
   8.905 +(cell)
   8.906 +] Text
   8.907 +End
   8.908 +
   8.909 +Begin %I Text
   8.910 +%I cfg Black
   8.911 +0 0 0 SetCFg
   8.912 +%I f *-times-medium-r-*-120-*
   8.913 +Times-Roman 12 SetF
   8.914 +%I t
   8.915 +[ 1 0 0 1 329 523 ] concat
   8.916 +%I
   8.917 +[
   8.918 +(cell)
   8.919 +] Text
   8.920 +End
   8.921 +
   8.922 +Begin %I Text
   8.923 +%I cfg Black
   8.924 +0 0 0 SetCFg
   8.925 +%I f *-times-medium-r-*-120-*
   8.926 +Times-Roman 12 SetF
   8.927 +%I t
   8.928 +[ 1 0 0 1 329 543 ] concat
   8.929 +%I
   8.930 +[
   8.931 +(cell)
   8.932 +] Text
   8.933 +End
   8.934 +
   8.935 +Begin %I Text
   8.936 +%I cfg Black
   8.937 +0 0 0 SetCFg
   8.938 +%I f *-times-medium-r-*-120-*
   8.939 +Times-Roman 12 SetF
   8.940 +%I t
   8.941 +[ 1 0 0 1 329 563 ] concat
   8.942 +%I
   8.943 +[
   8.944 +(cell)
   8.945 +] Text
   8.946 +End
   8.947 +
   8.948 +Begin %I Text
   8.949 +%I cfg Black
   8.950 +0 0 0 SetCFg
   8.951 +%I f *-times-medium-r-*-120-*
   8.952 +Times-Roman 12 SetF
   8.953 +%I t
   8.954 +[ 1 0 0 1 329 583 ] concat
   8.955 +%I
   8.956 +[
   8.957 +(cell)
   8.958 +] Text
   8.959 +End
   8.960 +
   8.961 +Begin %I Text
   8.962 +%I cfg Black
   8.963 +0 0 0 SetCFg
   8.964 +%I f *-times-medium-r-*-120-*
   8.965 +Times-Roman 12 SetF
   8.966 +%I t
   8.967 +[ 1 0 0 1 408 583 ] concat
   8.968 +%I
   8.969 +[
   8.970 +(cell)
   8.971 +] Text
   8.972 +End
   8.973 +
   8.974 +Begin %I Text
   8.975 +%I cfg Black
   8.976 +0 0 0 SetCFg
   8.977 +%I f *-times-medium-r-*-120-*
   8.978 +Times-Roman 12 SetF
   8.979 +%I t
   8.980 +[ 1 0 0 1 408 563 ] concat
   8.981 +%I
   8.982 +[
   8.983 +(cell)
   8.984 +] Text
   8.985 +End
   8.986 +
   8.987 +Begin %I Text
   8.988 +%I cfg Black
   8.989 +0 0 0 SetCFg
   8.990 +%I f *-times-medium-r-*-120-*
   8.991 +Times-Roman 12 SetF
   8.992 +%I t
   8.993 +[ 1 0 0 1 408 543 ] concat
   8.994 +%I
   8.995 +[
   8.996 +(cell)
   8.997 +] Text
   8.998 +End
   8.999 +
  8.1000 +Begin %I Text
  8.1001 +%I cfg Black
  8.1002 +0 0 0 SetCFg
  8.1003 +%I f *-times-medium-r-*-120-*
  8.1004 +Times-Roman 12 SetF
  8.1005 +%I t
  8.1006 +[ 1 0 0 1 408 523 ] concat
  8.1007 +%I
  8.1008 +[
  8.1009 +(cell)
  8.1010 +] Text
  8.1011 +End
  8.1012 +
  8.1013 +Begin %I Text
  8.1014 +%I cfg Black
  8.1015 +0 0 0 SetCFg
  8.1016 +%I f *-times-medium-r-*-120-*
  8.1017 +Times-Roman 12 SetF
  8.1018 +%I t
  8.1019 +[ 1 0 0 1 408 503 ] concat
  8.1020 +%I
  8.1021 +[
  8.1022 +(cell)
  8.1023 +] Text
  8.1024 +End
  8.1025 +
  8.1026 +Begin %I Text
  8.1027 +%I cfg Black
  8.1028 +0 0 0 SetCFg
  8.1029 +%I f *-times-medium-r-*-120-*
  8.1030 +Times-Roman 12 SetF
  8.1031 +%I t
  8.1032 +[ 1 0 0 1 408 483 ] concat
  8.1033 +%I
  8.1034 +[
  8.1035 +(cell)
  8.1036 +] Text
  8.1037 +End
  8.1038 +
  8.1039 +Begin %I Rect
  8.1040 +%I b 65535
  8.1041 +1 0 0 [] 0 SetB
  8.1042 +%I cfg White
  8.1043 +1 1 1 SetCFg
  8.1044 +%I cbg White
  8.1045 +1 1 1 SetCBg
  8.1046 +none SetP %I p n
  8.1047 +%I t
  8.1048 +[ 0.884157 0 0 0.762911 89.6252 344.908 ] concat
  8.1049 +%I
  8.1050 +23 135 609 560 Rect
  8.1051 +End
  8.1052 +
  8.1053 +End %I eop
  8.1054 +
  8.1055 +showpage
  8.1056 +
  8.1057 +%%Trailer
  8.1058 +
  8.1059 +end

     9.1 Binary file css3-tables/left-caption.png has changed

    10.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
    10.2 +++ b/css3-tables/table-overlap.idraw	Fri Jan 11 16:51:55 2013 +0100
    10.3 @@ -0,0 +1,824 @@
    10.4 +%!PS-Adobe-2.0 EPSF-1.2
    10.5 +%%DocumentFonts: Helvetica-Bold
    10.6 +%%Pages: 1
    10.7 +%%BoundingBox: 126 453 487 511
    10.8 +%%EndComments
    10.9 +
   10.10 +/IdrawDict 51 dict def
   10.11 +IdrawDict begin
   10.12 +
   10.13 +/reencodeISO {
   10.14 +dup dup findfont dup length dict begin
   10.15 +{ 1 index /FID ne { def }{ pop pop } ifelse } forall
   10.16 +/Encoding ISOLatin1Encoding def
   10.17 +currentdict end definefont
   10.18 +} def
   10.19 +
   10.20 +/ISOLatin1Encoding [
   10.21 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
   10.22 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
   10.23 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
   10.24 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
   10.25 +/space/exclam/quotedbl/numbersign/dollar/percent/ampersand/quoteright
   10.26 +/parenleft/parenright/asterisk/plus/comma/minus/period/slash
   10.27 +/zero/one/two/three/four/five/six/seven/eight/nine/colon/semicolon
   10.28 +/less/equal/greater/question/at/A/B/C/D/E/F/G/H/I/J/K/L/M/N
   10.29 +/O/P/Q/R/S/T/U/V/W/X/Y/Z/bracketleft/backslash/bracketright
   10.30 +/asciicircum/underscore/quoteleft/a/b/c/d/e/f/g/h/i/j/k/l/m
   10.31 +/n/o/p/q/r/s/t/u/v/w/x/y/z/braceleft/bar/braceright/asciitilde
   10.32 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
   10.33 +/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef/.notdef
   10.34 +/.notdef/dotlessi/grave/acute/circumflex/tilde/macron/breve
   10.35 +/dotaccent/dieresis/.notdef/ring/cedilla/.notdef/hungarumlaut
   10.36 +/ogonek/caron/space/exclamdown/cent/sterling/currency/yen/brokenbar
   10.37 +/section/dieresis/copyright/ordfeminine/guillemotleft/logicalnot
   10.38 +/hyphen/registered/macron/degree/plusminus/twosuperior/threesuperior
   10.39 +/acute/mu/paragraph/periodcentered/cedilla/onesuperior/ordmasculine
   10.40 +/guillemotright/onequarter/onehalf/threequarters/questiondown
   10.41 +/Agrave/Aacute/Acircumflex/Atilde/Adieresis/Aring/AE/Ccedilla
   10.42 +/Egrave/Eacute/Ecircumflex/Edieresis/Igrave/Iacute/Icircumflex
   10.43 +/Idieresis/Eth/Ntilde/Ograve/Oacute/Ocircumflex/Otilde/Odieresis
   10.44 +/multiply/Oslash/Ugrave/Uacute/Ucircumflex/Udieresis/Yacute
   10.45 +/Thorn/germandbls/agrave/aacute/acircumflex/atilde/adieresis
   10.46 +/aring/ae/ccedilla/egrave/eacute/ecircumflex/edieresis/igrave
   10.47 +/iacute/icircumflex/idieresis/eth/ntilde/ograve/oacute/ocircumflex
   10.48 +/otilde/odieresis/divide/oslash/ugrave/uacute/ucircumflex/udieresis
   10.49 +/yacute/thorn/ydieresis
   10.50 +] def
   10.51 +/Helvetica-Bold reencodeISO def
   10.52 +
   10.53 +/arrowHeight 8 def
   10.54 +/arrowWidth 4 def
   10.55 +/none null def
   10.56 +/numGraphicParameters 17 def
   10.57 +/stringLimit 65535 def
   10.58 +
   10.59 +/Begin {
   10.60 +save
   10.61 +numGraphicParameters dict begin
   10.62 +} def
   10.63 +
   10.64 +/End {
   10.65 +end
   10.66 +restore
   10.67 +} def
   10.68 +
   10.69 +/SetB {
   10.70 +dup type /nulltype eq {
   10.71 +pop
   10.72 +false /brushRightArrow idef
   10.73 +false /brushLeftArrow idef
   10.74 +true /brushNone idef
   10.75 +} {
   10.76 +/brushDashOffset idef
   10.77 +/brushDashArray idef
   10.78 +0 ne /brushRightArrow idef
   10.79 +0 ne /brushLeftArrow idef
   10.80 +/brushWidth idef
   10.81 +false /brushNone idef
   10.82 +} ifelse
   10.83 +} def
   10.84 +
   10.85 +/SetCFg {
   10.86 +/fgblue idef
   10.87 +/fggreen idef
   10.88 +/fgred idef
   10.89 +} def
   10.90 +
   10.91 +/SetCBg {
   10.92 +/bgblue idef
   10.93 +/bggreen idef
   10.94 +/bgred idef
   10.95 +} def
   10.96 +
   10.97 +/SetF {
   10.98 +/printSize idef
   10.99 +/printFont idef
  10.100 +} def
  10.101 +
  10.102 +/SetP {
  10.103 +dup type /nulltype eq {
  10.104 +pop true /patternNone idef
  10.105 +} {
  10.106 +dup -1 eq {
  10.107 +/patternGrayLevel idef
  10.108 +/patternString idef
  10.109 +} {
  10.110 +/patternGrayLevel idef
  10.111 +} ifelse
  10.112 +false /patternNone idef
  10.113 +} ifelse
  10.114 +} def
  10.115 +
  10.116 +/BSpl {
  10.117 +0 begin
  10.118 +storexyn
  10.119 +newpath
  10.120 +n 1 gt {
  10.121 +0 0 0 0 0 0 1 1 true subspline
  10.122 +n 2 gt {
  10.123 +0 0 0 0 1 1 2 2 false subspline
  10.124 +1 1 n 3 sub {
  10.125 +/i exch def
  10.126 +i 1 sub dup i dup i 1 add dup i 2 add dup false subspline
  10.127 +} for
  10.128 +n 3 sub dup n 2 sub dup n 1 sub dup 2 copy false subspline
  10.129 +} if
  10.130 +n 2 sub dup n 1 sub dup 2 copy 2 copy false subspline
  10.131 +patternNone not brushLeftArrow not brushRightArrow not and and { ifill } if
  10.132 +brushNone not { istroke } if
  10.133 +0 0 1 1 leftarrow
  10.134 +n 2 sub dup n 1 sub dup rightarrow
  10.135 +} if
  10.136 +end
  10.137 +} dup 0 4 dict put def
  10.138 +
  10.139 +/Circ {
  10.140 +newpath
  10.141 +0 360 arc
  10.142 +patternNone not { ifill } if
  10.143 +brushNone not { istroke } if
  10.144 +} def
  10.145 +
  10.146 +/CBSpl {
  10.147 +0 begin
  10.148 +dup 2 gt {
  10.149 +storexyn
  10.150 +newpath
  10.151 +n 1 sub dup 0 0 1 1 2 2 true subspline
  10.152 +1 1 n 3 sub {
  10.153 +/i exch def
  10.154 +i 1 sub dup i dup i 1 add dup i 2 add dup false subspline
  10.155 +} for
  10.156 +n 3 sub dup n 2 sub dup n 1 sub dup 0 0 false subspline
  10.157 +n 2 sub dup n 1 sub dup 0 0 1 1 false subspline
  10.158 +patternNone not { ifill } if
  10.159 +brushNone not { istroke } if
  10.160 +} {
  10.161 +Poly
  10.162 +} ifelse
  10.163 +end
  10.164 +} dup 0 4 dict put def
  10.165 +
  10.166 +/Elli {
  10.167 +0 begin
  10.168 +newpath
  10.169 +4 2 roll
  10.170 +translate
  10.171 +scale
  10.172 +0 0 1 0 360 arc
  10.173 +patternNone not { ifill } if
  10.174 +brushNone not { istroke } if
  10.175 +end
  10.176 +} dup 0 1 dict put def
  10.177 +
  10.178 +/Line {
  10.179 +0 begin
  10.180 +2 storexyn
  10.181 +newpath
  10.182 +x 0 get y 0 get moveto
  10.183 +x 1 get y 1 get lineto
  10.184 +brushNone not { istroke } if
  10.185 +0 0 1 1 leftarrow
  10.186 +0 0 1 1 rightarrow
  10.187 +end
  10.188 +} dup 0 4 dict put def
  10.189 +
  10.190 +/MLine {
  10.191 +0 begin
  10.192 +storexyn
  10.193 +newpath
  10.194 +n 1 gt {
  10.195 +x 0 get y 0 get moveto
  10.196 +1 1 n 1 sub {
  10.197 +/i exch def
  10.198 +x i get y i get lineto
  10.199 +} for
  10.200 +patternNone not brushLeftArrow not brushRightArrow not and and { ifill } if
  10.201 +brushNone not { istroke } if
  10.202 +0 0 1 1 leftarrow
  10.203 +n 2 sub dup n 1 sub dup rightarrow
  10.204 +} if
  10.205 +end
  10.206 +} dup 0 4 dict put def
  10.207 +
  10.208 +/Poly {
  10.209 +3 1 roll
  10.210 +newpath
  10.211 +moveto
  10.212 +-1 add
  10.213 +{ lineto } repeat
  10.214 +closepath
  10.215 +patternNone not { ifill } if
  10.216 +brushNone not { istroke } if
  10.217 +} def
  10.218 +
  10.219 +/Rect {
  10.220 +0 begin
  10.221 +/t exch def
  10.222 +/r exch def
  10.223 +/b exch def
  10.224 +/l exch def
  10.225 +newpath
  10.226 +l b moveto
  10.227 +l t lineto
  10.228 +r t lineto
  10.229 +r b lineto
  10.230 +closepath
  10.231 +patternNone not { ifill } if
  10.232 +brushNone not { istroke } if
  10.233 +end
  10.234 +} dup 0 4 dict put def
  10.235 +
  10.236 +/Text {
  10.237 +ishow
  10.238 +} def
  10.239 +
  10.240 +/idef {
  10.241 +dup where { pop pop pop } { exch def } ifelse
  10.242 +} def
  10.243 +
  10.244 +/ifill {
  10.245 +0 begin
  10.246 +gsave
  10.247 +patternGrayLevel -1 ne {
  10.248 +fgred bgred fgred sub patternGrayLevel mul add
  10.249 +fggreen bggreen fggreen sub patternGrayLevel mul add
  10.250 +fgblue bgblue fgblue sub patternGrayLevel mul add setrgbcolor
  10.251 +eofill
  10.252 +} {
  10.253 +eoclip
  10.254 +originalCTM setmatrix
  10.255 +pathbbox /t exch def /r exch def /b exch def /l exch def
  10.256 +/w r l sub ceiling cvi def
  10.257 +/h t b sub ceiling cvi def
  10.258 +/imageByteWidth w 8 div ceiling cvi def
  10.259 +/imageHeight h def
  10.260 +bgred bggreen bgblue setrgbcolor
  10.261 +eofill
  10.262 +fgred fggreen fgblue setrgbcolor
  10.263 +w 0 gt h 0 gt and {
  10.264 +l b translate w h scale
  10.265 +w h true [w 0 0 h neg 0 h] { patternproc } imagemask
  10.266 +} if
  10.267 +} ifelse
  10.268 +grestore
  10.269 +end
  10.270 +} dup 0 8 dict put def
  10.271 +
  10.272 +/istroke {
  10.273 +gsave
  10.274 +brushDashOffset -1 eq {
  10.275 +[] 0 setdash
  10.276 +1 setgray
  10.277 +} {
  10.278 +brushDashArray brushDashOffset setdash
  10.279 +fgred fggreen fgblue setrgbcolor
  10.280 +} ifelse
  10.281 +brushWidth setlinewidth
  10.282 +originalCTM setmatrix
  10.283 +stroke
  10.284 +grestore
  10.285 +} def
  10.286 +
  10.287 +/ishow {
  10.288 +0 begin
  10.289 +gsave
  10.290 +fgred fggreen fgblue setrgbcolor
  10.291 +printFont printSize scalefont setfont
  10.292 +/descender 0 printFont /FontBBox get 1 get printFont /FontMatrix
  10.293 +get transform exch pop def
  10.294 +/vertoffset 1 printSize sub descender sub def {
  10.295 +0 vertoffset moveto show
  10.296 +/vertoffset vertoffset printSize sub def
  10.297 +} forall
  10.298 +grestore
  10.299 +end
  10.300 +} dup 0 2 dict put def
  10.301 +
  10.302 +/patternproc {
  10.303 +0 begin
  10.304 +/patternByteLength patternString length def
  10.305 +/patternHeight patternByteLength 8 mul sqrt cvi def
  10.306 +/patternWidth patternHeight def
  10.307 +/patternByteWidth patternWidth 8 idiv def
  10.308 +/imageByteMaxLength imageByteWidth imageHeight mul
  10.309 +stringLimit patternByteWidth sub min def
  10.310 +/imageMaxHeight imageByteMaxLength imageByteWidth idiv patternHeight idiv
  10.311 +patternHeight mul patternHeight max def
  10.312 +/imageHeight imageHeight imageMaxHeight sub store
  10.313 +/imageString imageByteWidth imageMaxHeight mul patternByteWidth add string def
  10.314 +0 1 imageMaxHeight 1 sub {
  10.315 +/y exch def
  10.316 +/patternRow y patternByteWidth mul patternByteLength mod def
  10.317 +/patternRowString patternString patternRow patternByteWidth getinterval def
  10.318 +/imageRow y imageByteWidth mul def
  10.319 +0 patternByteWidth imageByteWidth 1 sub {
  10.320 +/x exch def
  10.321 +imageString imageRow x add patternRowString putinterval
  10.322 +} for
  10.323 +} for
  10.324 +imageString
  10.325 +end
  10.326 +} dup 0 12 dict put def
  10.327 +
  10.328 +/min {
  10.329 +dup 3 2 roll dup 4 3 roll lt { exch } if pop
  10.330 +} def
  10.331 +
  10.332 +/max {
  10.333 +dup 3 2 roll dup 4 3 roll gt { exch } if pop
  10.334 +} def
  10.335 +
  10.336 +/arrowhead {
  10.337 +0 begin
  10.338 +transform originalCTM itransform
  10.339 +/taily exch def
  10.340 +/tailx exch def
  10.341 +transform originalCTM itransform
  10.342 +/tipy exch def
  10.343 +/tipx exch def
  10.344 +/dy tipy taily sub def
  10.345 +/dx tipx tailx sub def
  10.346 +/angle dx 0 ne dy 0 ne or { dy dx atan } { 90 } ifelse def
  10.347 +gsave
  10.348 +originalCTM setmatrix
  10.349 +tipx tipy translate
  10.350 +angle rotate
  10.351 +newpath
  10.352 +0 0 moveto
  10.353 +arrowHeight neg arrowWidth 2 div lineto
  10.354 +arrowHeight neg arrowWidth 2 div neg lineto
  10.355 +closepath
  10.356 +patternNone not {
  10.357 +originalCTM setmatrix
  10.358 +/padtip arrowHeight 2 exp 0.25 arrowWidth 2 exp mul add sqrt brushWidth mul
  10.359 +arrowWidth div def
  10.360 +/padtail brushWidth 2 div def
  10.361 +tipx tipy translate
  10.362 +angle rotate
  10.363 +padtip 0 translate
  10.364 +arrowHeight padtip add padtail add arrowHeight div dup scale
  10.365 +arrowheadpath
  10.366 +ifill
  10.367 +} if
  10.368 +brushNone not {
  10.369 +originalCTM setmatrix
  10.370 +tipx tipy translate
  10.371 +angle rotate
  10.372 +arrowheadpath
  10.373 +istroke
  10.374 +} if
  10.375 +grestore
  10.376 +end
  10.377 +} dup 0 9 dict put def
  10.378 +
  10.379 +/arrowheadpath {
  10.380 +newpath
  10.381 +0 0 moveto
  10.382 +arrowHeight neg arrowWidth 2 div lineto
  10.383 +arrowHeight neg arrowWidth 2 div neg lineto
  10.384 +closepath
  10.385 +} def
  10.386 +
  10.387 +/leftarrow {
  10.388 +0 begin
  10.389 +y exch get /taily exch def
  10.390 +x exch get /tailx exch def
  10.391 +y exch get /tipy exch def
  10.392 +x exch get /tipx exch def
  10.393 +brushLeftArrow { tipx tipy tailx taily arrowhead } if
  10.394 +end
  10.395 +} dup 0 4 dict put def
  10.396 +
  10.397 +/rightarrow {
  10.398 +0 begin
  10.399 +y exch get /tipy exch def
  10.400 +x exch get /tipx exch def
  10.401 +y exch get /taily exch def
  10.402 +x exch get /tailx exch def
  10.403 +brushRightArrow { tipx tipy tailx taily arrowhead } if
  10.404 +end
  10.405 +} dup 0 4 dict put def
  10.406 +
  10.407 +/midpoint {
  10.408 +0 begin
  10.409 +/y1 exch def
  10.410 +/x1 exch def
  10.411 +/y0 exch def
  10.412 +/x0 exch def
  10.413 +x0 x1 add 2 div
  10.414 +y0 y1 add 2 div
  10.415 +end
  10.416 +} dup 0 4 dict put def
  10.417 +
  10.418 +/thirdpoint {
  10.419 +0 begin
  10.420 +/y1 exch def
  10.421 +/x1 exch def
  10.422 +/y0 exch def
  10.423 +/x0 exch def
  10.424 +x0 2 mul x1 add 3 div
  10.425 +y0 2 mul y1 add 3 div
  10.426 +end
  10.427 +} dup 0 4 dict put def
  10.428 +
  10.429 +/subspline {
  10.430 +0 begin
  10.431 +/movetoNeeded exch def
  10.432 +y exch get /y3 exch def
  10.433 +x exch get /x3 exch def
  10.434 +y exch get /y2 exch def
  10.435 +x exch get /x2 exch def
  10.436 +y exch get /y1 exch def
  10.437 +x exch get /x1 exch def
  10.438 +y exch get /y0 exch def
  10.439 +x exch get /x0 exch def
  10.440 +x1 y1 x2 y2 thirdpoint
  10.441 +/p1y exch def
  10.442 +/p1x exch def
  10.443 +x2 y2 x1 y1 thirdpoint
  10.444 +/p2y exch def
  10.445 +/p2x exch def
  10.446 +x1 y1 x0 y0 thirdpoint
  10.447 +p1x p1y midpoint
  10.448 +/p0y exch def
  10.449 +/p0x exch def
  10.450 +x2 y2 x3 y3 thirdpoint
  10.451 +p2x p2y midpoint
  10.452 +/p3y exch def
  10.453 +/p3x exch def
  10.454 +movetoNeeded { p0x p0y moveto } if
  10.455 +p1x p1y p2x p2y p3x p3y curveto
  10.456 +end
  10.457 +} dup 0 17 dict put def
  10.458 +
  10.459 +/storexyn {
  10.460 +/n exch def
  10.461 +/y n array def
  10.462 +/x n array def
  10.463 +n 1 sub -1 0 {
  10.464 +/i exch def
  10.465 +y i 3 2 roll put
  10.466 +x i 3 2 roll put
  10.467 +} for
  10.468 +} def
  10.469 +
  10.470 +%%EndProlog
  10.471 +
  10.472 +%I Idraw 9 Grid 8 
  10.473 +
  10.474 +%%Page: 1 1
  10.475 +
  10.476 +Begin
  10.477 +%I b u
  10.478 +%I cfg u
  10.479 +%I cbg u
  10.480 +%I f u
  10.481 +%I p u
  10.482 +%I t
  10.483 +[ 0.8 0 0 0.8 0 0 ] concat
  10.484 +/originalCTM matrix currentmatrix def
  10.485 +
  10.486 +Begin %I Poly
  10.487 +%I b 65535
  10.488 +1 0 0 [] 0 SetB
  10.489 +%I cfg Black
  10.490 +0 0 0 SetCFg
  10.491 +%I cbg White
  10.492 +1 1 1 SetCBg
  10.493 +%I p
  10.494 +0.75 SetP
  10.495 +%I t
  10.496 +[ 1 0 0 1.01281 118 191.35 ] concat
  10.497 +%I 4
  10.498 +191 411
  10.499 +191 441
  10.500 +231 441
  10.501 +231 411
  10.502 +4 Poly
  10.503 +End
  10.504 +
  10.505 +Begin %I Poly
  10.506 +%I b 65535
  10.507 +1 0 0 [] 0 SetB
  10.508 +%I cfg Black
  10.509 +0 0 0 SetCFg
  10.510 +%I cbg White
  10.511 +1 1 1 SetCBg
  10.512 +%I p
  10.513 +0.75 SetP
  10.514 +%I t
  10.515 +[ 1 0 0 1.01281 118 191.35 ] concat
  10.516 +%I 4
  10.517 +141 411
  10.518 +141 441
  10.519 +181 441
  10.520 +181 411
  10.521 +4 Poly
  10.522 +End
  10.523 +
  10.524 +Begin %I Poly
  10.525 +%I b 65535
  10.526 +1 0 0 [] 0 SetB
  10.527 +%I cfg Black
  10.528 +0 0 0 SetCFg
  10.529 +%I cbg White
  10.530 +1 1 1 SetCBg
  10.531 +%I p
  10.532 +0.75 SetP
  10.533 +%I t
  10.534 +[ 1 0 0 1.01281 118 191.863 ] concat
  10.535 +%I 4
  10.536 +41 371
  10.537 +41 401
  10.538 +131 401
  10.539 +131 371
  10.540 +4 Poly
  10.541 +End
  10.542 +
  10.543 +Begin %I Poly
  10.544 +%I b 65535
  10.545 +1 0 0 [] 0 SetB
  10.546 +%I cfg Black
  10.547 +0 0 0 SetCFg
  10.548 +%I cbg White
  10.549 +1 1 1 SetCBg
  10.550 +%I p
  10.551 +0.75 SetP
  10.552 +%I t
  10.553 +[ 0.80198 0 0 2.00092 143.941 -244.406 ] concat
  10.554 +%I 4
  10.555 +81 406
  10.556 +81 441
  10.557 +131 441
  10.558 +131 406
  10.559 +4 Poly
  10.560 +End
  10.561 +
  10.562 +Begin %I Poly
  10.563 +%I b 65535
  10.564 +1 0 0 [] 0 SetB
  10.565 +%I cfg Black
  10.566 +0 0 0 SetCFg
  10.567 +%I cbg White
  10.568 +1 1 1 SetCBg
  10.569 +%I p
  10.570 +0.75 SetP
  10.571 +%I t
  10.572 +[ 0.751268 0 0 0.753433 128.295 305.736 ] concat
  10.573 +%I 4
  10.574 +41 401
  10.575 +41 441
  10.576 +94 441
  10.577 +94 401
  10.578 +4 Poly
  10.579 +End
  10.580 +
  10.581 +Begin %I Text
  10.582 +%I cfg Black
  10.583 +0 0 0 SetCFg
  10.584 +%I f *-helvetica-bold-r-*-140-*
  10.585 +Helvetica-Bold 14 SetF
  10.586 +%I t
  10.587 +[ 1 0 0 1 169 628 ] concat
  10.588 +%I
  10.589 +[
  10.590 +(1)
  10.591 +] Text
  10.592 +End
  10.593 +
  10.594 +Begin %I Text
  10.595 +%I cfg Black
  10.596 +0 0 0 SetCFg
  10.597 +%I f *-helvetica-bold-r-*-140-*
  10.598 +Helvetica-Bold 14 SetF
  10.599 +%I t
  10.600 +[ 1 0 0 1 219 628 ] concat
  10.601 +%I
  10.602 +[
  10.603 +(2)
  10.604 +] Text
  10.605 +End
  10.606 +
  10.607 +Begin %I Text
  10.608 +%I cfg Black
  10.609 +0 0 0 SetCFg
  10.610 +%I f *-helvetica-bold-r-*-140-*
  10.611 +Helvetica-Bold 14 SetF
  10.612 +%I t
  10.613 +[ 1 0 0 1 269 628 ] concat
  10.614 +%I
  10.615 +[
  10.616 +(3)
  10.617 +] Text
  10.618 +End
  10.619 +
  10.620 +Begin %I Text
  10.621 +%I cfg Black
  10.622 +0 0 0 SetCFg
  10.623 +%I f *-helvetica-bold-r-*-140-*
  10.624 +Helvetica-Bold 14 SetF
  10.625 +%I t
  10.626 +[ 1 0 0 1 319 628 ] concat
  10.627 +%I
  10.628 +[
  10.629 +(4)
  10.630 +] Text
  10.631 +End
  10.632 +
  10.633 +Begin %I Text
  10.634 +%I cfg Black
  10.635 +0 0 0 SetCFg
  10.636 +%I f *-helvetica-bold-r-*-140-*
  10.637 +Helvetica-Bold 14 SetF
  10.638 +%I t
  10.639 +[ 1 0 0 1 169 588 ] concat
  10.640 +%I
  10.641 +[
  10.642 +(5)
  10.643 +] Text
  10.644 +End
  10.645 +
  10.646 +Begin %I Rect
  10.647 +%I b 65535
  10.648 +1 0 0 [] 0 SetB
  10.649 +%I cfg Black
  10.650 +0 0 0 SetCFg
  10.651 +%I cbg White
  10.652 +1 1 1 SetCBg
  10.653 +%I p
  10.654 +0.5 SetP
  10.655 +%I t
  10.656 +[ 0.5 0 0 0.5 148 438.5 ] concat
  10.657 +%I
  10.658 +122 259 202 319 Rect
  10.659 +End
  10.660 +
  10.661 +Begin %I Poly
  10.662 +%I b 65535
  10.663 +1 0 0 [] 0 SetB
  10.664 +%I cfg Black
  10.665 +0 0 0 SetCFg
  10.666 +%I cbg White
  10.667 +1 1 1 SetCBg
  10.668 +%I p
  10.669 +0.75 SetP
  10.670 +%I t
  10.671 +[ 1 0 0 1.01281 377 191.35 ] concat
  10.672 +%I 4
  10.673 +191 411
  10.674 +191 441
  10.675 +231 441
  10.676 +231 411
  10.677 +4 Poly
  10.678 +End
  10.679 +
  10.680 +Begin %I Poly
  10.681 +%I b 65535
  10.682 +1 0 0 [] 0 SetB
  10.683 +%I cfg Black
  10.684 +0 0 0 SetCFg
  10.685 +%I cbg White
  10.686 +1 1 1 SetCBg
  10.687 +%I p
  10.688 +0.75 SetP
  10.689 +%I t
  10.690 +[ 1 0 0 1.01281 377 191.35 ] concat
  10.691 +%I 4
  10.692 +141 411
  10.693 +141 441
  10.694 +181 441
  10.695 +181 411
  10.696 +4 Poly
  10.697 +End
  10.698 +
  10.699 +Begin %I Poly
  10.700 +%I b 65535
  10.701 +1 0 0 [] 0 SetB
  10.702 +%I cfg Black
  10.703 +0 0 0 SetCFg
  10.704 +%I cbg White
  10.705 +1 1 1 SetCBg
  10.706 +%I p
  10.707 +0.75 SetP
  10.708 +%I t
  10.709 +[ 1 0 0 1.01281 477 191.863 ] concat
  10.710 +%I 4
  10.711 +41 371
  10.712 +41 401
  10.713 +131 401
  10.714 +131 371
  10.715 +4 Poly
  10.716 +End
  10.717 +
  10.718 +Begin %I Poly
  10.719 +%I b 65535
  10.720 +1 0 0 [] 0 SetB
  10.721 +%I cfg Black
  10.722 +0 0 0 SetCFg
  10.723 +%I cbg White
  10.724 +1 1 1 SetCBg
  10.725 +%I p
  10.726 +0.75 SetP
  10.727 +%I t
  10.728 +[ 0.80198 0 0 2.00092 402.941 -244.406 ] concat
  10.729 +%I 4
  10.730 +81 406
  10.731 +81 441
  10.732 +131 441
  10.733 +131 406
  10.734 +4 Poly
  10.735 +End
  10.736 +
  10.737 +Begin %I Poly
  10.738 +%I b 65535
  10.739 +1 0 0 [] 0 SetB
  10.740 +%I cfg Black
  10.741 +0 0 0 SetCFg
  10.742 +%I cbg White
  10.743 +1 1 1 SetCBg
  10.744 +%I p
  10.745 +0.75 SetP
  10.746 +%I t
  10.747 +[ 0.751268 0 0 0.753433 387.295 305.736 ] concat
  10.748 +%I 4
  10.749 +41 401
  10.750 +41 441
  10.751 +94 441
  10.752 +94 401
  10.753 +4 Poly
  10.754 +End
  10.755 +
  10.756 +Begin %I Text
  10.757 +%I cfg Black
  10.758 +0 0 0 SetCFg
  10.759 +%I f *-helvetica-bold-r-*-140-*
  10.760 +Helvetica-Bold 14 SetF
  10.761 +%I t
  10.762 +[ 1 0 0 1 428 628 ] concat
  10.763 +%I
  10.764 +[
  10.765 +(1)
  10.766 +] Text
  10.767 +End
  10.768 +
  10.769 +Begin %I Text
  10.770 +%I cfg Black
  10.771 +0 0 0 SetCFg
  10.772 +%I f *-helvetica-bold-r-*-140-*
  10.773 +Helvetica-Bold 14 SetF
  10.774 +%I t
  10.775 +[ 1 0 0 1 478 628 ] concat
  10.776 +%I
  10.777 +[
  10.778 +(2)
  10.779 +] Text
  10.780 +End
  10.781 +
  10.782 +Begin %I Text
  10.783 +%I cfg Black
  10.784 +0 0 0 SetCFg
  10.785 +%I f *-helvetica-bold-r-*-140-*
  10.786 +Helvetica-Bold 14 SetF
  10.787 +%I t
  10.788 +[ 1 0 0 1 528 628 ] concat
  10.789 +%I
  10.790 +[
  10.791 +(3)
  10.792 +] Text
  10.793 +End
  10.794 +
  10.795 +Begin %I Text
  10.796 +%I cfg Black
  10.797 +0 0 0 SetCFg
  10.798 +%I f *-helvetica-bold-r-*-140-*
  10.799 +Helvetica-Bold 14 SetF
  10.800 +%I t
  10.801 +[ 1 0 0 1 578 628 ] concat
  10.802 +%I
  10.803 +[
  10.804 +(4)
  10.805 +] Text
  10.806 +End
  10.807 +
  10.808 +Begin %I Text
  10.809 +%I cfg Black
  10.810 +0 0 0 SetCFg
  10.811 +%I f *-helvetica-bold-r-*-140-*
  10.812 +Helvetica-Bold 14 SetF
  10.813 +%I t
  10.814 +[ 1 0 0 1 528 588 ] concat
  10.815 +%I
  10.816 +[
  10.817 +(5)
  10.818 +] Text
  10.819 +End
  10.820 +
  10.821 +End %I eop
  10.822 +
  10.823 +showpage
  10.824 +
  10.825 +%%Trailer
  10.826 +
  10.827 +end

    11.1 Binary file css3-tables/table-overlap.png has changed

    12.1 Binary file css3-tables/table1.png has changed

    13.1 Binary file css3-tables/tabs.png has changed

    14.1 Binary file css3-tables/tbl-border-conflict.png has changed

    15.1 Binary file css3-tables/tbl-empty.png has changed

    16.1 Binary file css3-tables/tbl-layers.png has changed

    17.1 Binary file css3-tables/tbl-spacing.png has changed

    18.1 Binary file css3-tables/tbl-width.png has changed

    19.1 Binary file css3-tables/top-caption.png has changed

css3-tables/CSStbl3.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/Makefile		file \| annotate \| diff \| comparison \| revisions
css3-tables/Overview.html		file \| annotate \| diff \| comparison \| revisions
css3-tables/Overview.src.html		file \| annotate \| diff \| comparison \| revisions
css3-tables/bg.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/cell-align.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/css-tabs.html		file \| annotate \| diff \| comparison \| revisions
css3-tables/left-caption.idraw		file \| annotate \| diff \| comparison \| revisions
css3-tables/left-caption.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/table-overlap.idraw		file \| annotate \| diff \| comparison \| revisions
css3-tables/table-overlap.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/table1.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/tabs.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/tbl-border-conflict.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/tbl-empty.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/tbl-layers.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/tbl-spacing.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/tbl-width.png		file \| annotate \| diff \| comparison \| revisions
css3-tables/top-caption.png		file \| annotate \| diff \| comparison \| revisions

Mercurial > drafts / changeset

changeset

Copied from the member-only version, because it is easier to generate a complete property index for the WG when the draft is linked from http://www.w3.org/Style/CSS/current-work