[html5] r6276 - [e] (0) Attempt to reorganise the rendering section to make it more usable for i [...]
whatwg at whatwg.org
whatwg at whatwg.org
Fri Jul 1 17:13:00 PDT 2011
Author: ianh
Date: 2011-07-01 17:12:59 -0700 (Fri, 01 Jul 2011)
New Revision: 6276
Modified:
complete.html
index
source
Log:
[e] (0) Attempt to reorganise the rendering section to make it more usable for implementors
Fixing http://www.w3.org/Bugs/Public/show_bug.cgi?id=13019
Modified: complete.html
===================================================================
--- complete.html 2011-06-30 23:52:43 UTC (rev 6275)
+++ complete.html 2011-07-02 00:12:59 UTC (rev 6276)
@@ -239,7 +239,7 @@
<header class=head id=head><p><a class=logo href=http://www.whatwg.org/><img alt=WHATWG height=101 src=/images/logo width=101></a></p>
<hgroup><h1>Web Applications 1.0</h1>
- <h2 class="no-num no-toc">Living Standard — Last Updated 30 June 2011</h2>
+ <h2 class="no-num no-toc">Living Standard — Last Updated 1 July 2011</h2>
</hgroup><dl><dt>Multiple-page version:</dt>
<dd><a href=http://www.whatwg.org/specs/web-apps/current-work/complete/>http://www.whatwg.org/specs/web-apps/current-work/complete/</a></dd>
<dt>One-page version:</dt>
@@ -1278,59 +1278,62 @@
<li><a href=#rendering><span class=secno>15 </span>Rendering</a>
<ol>
<li><a href=#introduction-16><span class=secno>15.1 </span>Introduction</a></li>
- <li><a href=#the-css-user-agent-style-sheet-and-presentational-hints><span class=secno>15.2 </span>The CSS user agent style sheet and presentational hints</a>
+ <li><a href=#the-css-user-agent-style-sheet-and-presentational-hints><span class=secno>15.2 </span>The CSS user agent style sheet and presentational hints</a></li>
+ <li><a href=#non-replaced-elements><span class=secno>15.3 </span>Non-replaced elements</a>
<ol>
- <li><a href=#introduction-17><span class=secno>15.2.1 </span>Introduction</a></li>
- <li><a href=#display-types><span class=secno>15.2.2 </span>Display types</a></li>
- <li><a href=#margins-and-padding><span class=secno>15.2.3 </span>Margins and padding</a></li>
- <li><a href=#alignment><span class=secno>15.2.4 </span>Alignment</a></li>
- <li><a href=#fonts-and-colors><span class=secno>15.2.5 </span>Fonts and colors</a></li>
- <li><a href=#punctuation-and-decorations><span class=secno>15.2.6 </span>Punctuation and decorations</a></li>
- <li><a href=#resetting-rules-for-inherited-properties><span class=secno>15.2.7 </span>Resetting rules for inherited properties</a></li>
- <li><a href=#the-hr-element-0><span class=secno>15.2.8 </span>The <code>hr</code> element</a></li>
- <li><a href=#the-fieldset-element-0><span class=secno>15.2.9 </span>The <code>fieldset</code> element</a></ol></li>
- <li><a href=#replaced-elements><span class=secno>15.3 </span>Replaced elements</a>
+ <li><a href=#hidden-elements><span class=secno>15.3.1 </span>Hidden elements</a></li>
+ <li><a href=#the-page><span class=secno>15.3.2 </span>The page</a></li>
+ <li><a href=#flow-content-1><span class=secno>15.3.3 </span>Flow content</a></li>
+ <li><a href=#phrasing-content-1><span class=secno>15.3.4 </span>Phrasing content</a></li>
+ <li><a href=#bidirectional-text><span class=secno>15.3.5 </span>Bidirectional text</a></li>
+ <li><a href=#sections-and-headings><span class=secno>15.3.6 </span>Sections and headings</a></li>
+ <li><a href=#lists><span class=secno>15.3.7 </span>Lists</a></li>
+ <li><a href=#tables><span class=secno>15.3.8 </span>Tables</a></li>
+ <li><a href=#form-controls><span class=secno>15.3.9 </span>Form controls</a></li>
+ <li><a href=#the-hr-element-0><span class=secno>15.3.10 </span>The <code>hr</code> element</a></li>
+ <li><a href=#the-fieldset-element-0><span class=secno>15.3.11 </span>The <code>fieldset</code> element</a></ol></li>
+ <li><a href=#replaced-elements><span class=secno>15.4 </span>Replaced elements</a>
<ol>
- <li><a href=#embedded-content-2><span class=secno>15.3.1 </span>Embedded content</a></li>
- <li><a href=#timed-text-tracks-0><span class=secno>15.3.2 </span>Timed text tracks</a>
+ <li><a href=#embedded-content-2><span class=secno>15.4.1 </span>Embedded content</a></li>
+ <li><a href=#timed-text-tracks-0><span class=secno>15.4.2 </span>Timed text tracks</a>
<ol>
- <li><a href=#webvtt-cue-text-rendering-rules><span class=secno>15.3.2.1 </span>WebVTT cue text rendering rules</a></li>
- <li><a href=#applying-css-properties-to-webvtt-node-objects><span class=secno>15.3.2.2 </span>Applying CSS properties to WebVTT Node Objects</a></li>
- <li><a href=#css-extensions><span class=secno>15.3.2.3 </span>CSS extensions</a>
+ <li><a href=#webvtt-cue-text-rendering-rules><span class=secno>15.4.2.1 </span>WebVTT cue text rendering rules</a></li>
+ <li><a href=#applying-css-properties-to-webvtt-node-objects><span class=secno>15.4.2.2 </span>Applying CSS properties to WebVTT Node Objects</a></li>
+ <li><a href=#css-extensions><span class=secno>15.4.2.3 </span>CSS extensions</a>
<ol>
- <li><a href="#the-'::cue'-pseudo-element"><span class=secno>15.3.2.3.1 </span>The '::cue' pseudo-element</a></li>
- <li><a href="#the-':past'-and-':future'-pseudo-classes"><span class=secno>15.3.2.3.2 </span>The ':past' and ':future' pseudo-classes</a></ol></ol></li>
- <li><a href=#images-0><span class=secno>15.3.3 </span>Images</a></li>
- <li><a href=#attributes-for-embedded-content-and-images><span class=secno>15.3.4 </span>Attributes for embedded content and images</a></li>
- <li><a href=#image-maps-0><span class=secno>15.3.5 </span>Image maps</a></li>
- <li><a href=#toolbars-0><span class=secno>15.3.6 </span>Toolbars</a></ol></li>
- <li><a href=#bindings><span class=secno>15.4 </span>Bindings</a>
+ <li><a href="#the-'::cue'-pseudo-element"><span class=secno>15.4.2.3.1 </span>The '::cue' pseudo-element</a></li>
+ <li><a href="#the-':past'-and-':future'-pseudo-classes"><span class=secno>15.4.2.3.2 </span>The ':past' and ':future' pseudo-classes</a></ol></ol></li>
+ <li><a href=#images-0><span class=secno>15.4.3 </span>Images</a></li>
+ <li><a href=#attributes-for-embedded-content-and-images><span class=secno>15.4.4 </span>Attributes for embedded content and images</a></li>
+ <li><a href=#image-maps-0><span class=secno>15.4.5 </span>Image maps</a></li>
+ <li><a href=#toolbars-0><span class=secno>15.4.6 </span>Toolbars</a></ol></li>
+ <li><a href=#bindings><span class=secno>15.5 </span>Bindings</a>
<ol>
- <li><a href=#introduction-18><span class=secno>15.4.1 </span>Introduction</a></li>
- <li><a href=#the-button-element-0><span class=secno>15.4.2 </span>The <code>button</code> element</a></li>
- <li><a href=#the-details-element-0><span class=secno>15.4.3 </span>The <code>details</code> element</a></li>
- <li><a href=#the-input-element-as-a-text-entry-widget><span class=secno>15.4.4 </span>The <code>input</code> element as a text entry widget</a></li>
- <li><a href=#the-input-element-as-domain-specific-widgets><span class=secno>15.4.5 </span>The <code>input</code> element as domain-specific widgets</a></li>
- <li><a href=#the-input-element-as-a-range-control><span class=secno>15.4.6 </span>The <code>input</code> element as a range control</a></li>
- <li><a href=#the-input-element-as-a-color-well><span class=secno>15.4.7 </span>The <code>input</code> element as a color well</a></li>
- <li><a href=#the-input-element-as-a-checkbox-and-radio-button-widgets><span class=secno>15.4.8 </span>The <code>input</code> element as a checkbox and radio button widgets</a></li>
- <li><a href=#the-input-element-as-a-file-upload-control><span class=secno>15.4.9 </span>The <code>input</code> element as a file upload control</a></li>
- <li><a href=#the-input-element-as-a-button><span class=secno>15.4.10 </span>The <code>input</code> element as a button</a></li>
- <li><a href=#the-marquee-element-0><span class=secno>15.4.11 </span>The <code>marquee</code> element</a></li>
- <li><a href=#the-meter-element-0><span class=secno>15.4.12 </span>The <code>meter</code> element</a></li>
- <li><a href=#the-progress-element-0><span class=secno>15.4.13 </span>The <code>progress</code> element</a></li>
- <li><a href=#the-select-element-0><span class=secno>15.4.14 </span>The <code>select</code> element</a></li>
- <li><a href=#the-textarea-element-0><span class=secno>15.4.15 </span>The <code>textarea</code> element</a></li>
- <li><a href=#the-keygen-element-0><span class=secno>15.4.16 </span>The <code>keygen</code> element</a></li>
- <li><a href=#the-time-element-0><span class=secno>15.4.17 </span>The <code>time</code> element</a></ol></li>
- <li><a href=#frames-and-framesets><span class=secno>15.5 </span>Frames and framesets</a></li>
- <li><a href=#interactive-media><span class=secno>15.6 </span>Interactive media</a>
+ <li><a href=#introduction-17><span class=secno>15.5.1 </span>Introduction</a></li>
+ <li><a href=#the-button-element-0><span class=secno>15.5.2 </span>The <code>button</code> element</a></li>
+ <li><a href=#the-details-element-0><span class=secno>15.5.3 </span>The <code>details</code> element</a></li>
+ <li><a href=#the-input-element-as-a-text-entry-widget><span class=secno>15.5.4 </span>The <code>input</code> element as a text entry widget</a></li>
+ <li><a href=#the-input-element-as-domain-specific-widgets><span class=secno>15.5.5 </span>The <code>input</code> element as domain-specific widgets</a></li>
+ <li><a href=#the-input-element-as-a-range-control><span class=secno>15.5.6 </span>The <code>input</code> element as a range control</a></li>
+ <li><a href=#the-input-element-as-a-color-well><span class=secno>15.5.7 </span>The <code>input</code> element as a color well</a></li>
+ <li><a href=#the-input-element-as-a-checkbox-and-radio-button-widgets><span class=secno>15.5.8 </span>The <code>input</code> element as a checkbox and radio button widgets</a></li>
+ <li><a href=#the-input-element-as-a-file-upload-control><span class=secno>15.5.9 </span>The <code>input</code> element as a file upload control</a></li>
+ <li><a href=#the-input-element-as-a-button><span class=secno>15.5.10 </span>The <code>input</code> element as a button</a></li>
+ <li><a href=#the-marquee-element-0><span class=secno>15.5.11 </span>The <code>marquee</code> element</a></li>
+ <li><a href=#the-meter-element-0><span class=secno>15.5.12 </span>The <code>meter</code> element</a></li>
+ <li><a href=#the-progress-element-0><span class=secno>15.5.13 </span>The <code>progress</code> element</a></li>
+ <li><a href=#the-select-element-0><span class=secno>15.5.14 </span>The <code>select</code> element</a></li>
+ <li><a href=#the-textarea-element-0><span class=secno>15.5.15 </span>The <code>textarea</code> element</a></li>
+ <li><a href=#the-keygen-element-0><span class=secno>15.5.16 </span>The <code>keygen</code> element</a></li>
+ <li><a href=#the-time-element-0><span class=secno>15.5.17 </span>The <code>time</code> element</a></ol></li>
+ <li><a href=#frames-and-framesets><span class=secno>15.6 </span>Frames and framesets</a></li>
+ <li><a href=#interactive-media><span class=secno>15.7 </span>Interactive media</a>
<ol>
- <li><a href=#links,-forms,-and-navigation><span class=secno>15.6.1 </span>Links, forms, and navigation</a></li>
- <li><a href=#the-title-attribute-0><span class=secno>15.6.2 </span>The <code title=attr-title>title</code> attribute</a></li>
- <li><a href=#editing-hosts><span class=secno>15.6.3 </span>Editing hosts</a></li>
- <li><a href=#text-rendered-in-native-user-interfaces><span class=secno>15.6.4 </span>Text rendered in native user interfaces</a></ol></li>
- <li><a href=#print-media><span class=secno>15.7 </span>Print media</a></ol></li>
+ <li><a href=#links,-forms,-and-navigation><span class=secno>15.7.1 </span>Links, forms, and navigation</a></li>
+ <li><a href=#the-title-attribute-0><span class=secno>15.7.2 </span>The <code title=attr-title>title</code> attribute</a></li>
+ <li><a href=#editing-hosts><span class=secno>15.7.3 </span>Editing hosts</a></li>
+ <li><a href=#text-rendered-in-native-user-interfaces><span class=secno>15.7.4 </span>Text rendered in native user interfaces</a></ol></li>
+ <li><a href=#print-media><span class=secno>15.8 </span>Print media</a></ol></li>
<li><a href=#obsolete><span class=secno>16 </span>Obsolete features</a>
<ol>
<li><a href=#obsolete-but-conforming-features><span class=secno>16.1 </span>Obsolete but conforming features</a>
@@ -91742,15 +91745,10 @@
element is not <a href=#being-rendered>being rendered</a>, though this might be
overridden by the style sheets.</p>
- </div>
- <div class=impl>
-
<h3 id=the-css-user-agent-style-sheet-and-presentational-hints><span class=secno>15.2 </span>The CSS user agent style sheet and presentational hints</h3>
- <h4 id=introduction-17><span class=secno>15.2.1 </span>Introduction</h4>
-
<p>The CSS rules given in these subsections are, except where
otherwise specified, expected to be used as part of the user-agent
level style sheet defaults for all documents that contain <a href=#html-elements>HTML
@@ -91796,136 +91794,43 @@
the dimension was an integer, and with the value given as a
percentage if the dimension was a percentage.</p>
- </div>
+ <p>When a user agent is to <dfn id=align-descendants>align descendants</dfn> of a node,
+ the user agent is expected to align only those descendants that have
+ both their 'margin-left' and 'margin-right' properties computing to
+ a value other than 'auto', that are over-constrained and that have
+ one of those two margins with a used value forced to a greater
+ value, and that do not themselves have an applicable <code title=attr-align>align</code> attribute. When multiple elements
+ are to <a href=#align-descendants title="align descendants">align</a> a particular
+ descendant, the most deeply nested such element is expected to
+ override the others.</p>
- <div class=impl>
- <h4 id=display-types><span class=secno>15.2.2 </span>Display types</h4>
+ <h3 id=non-replaced-elements><span class=secno>15.3 </span>Non-replaced elements</h3>
+
+ <h4 id=hidden-elements><span class=secno>15.3.1 </span>Hidden elements</h4>
+
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
[hidden], area, base, basefont, command, datalist, head,
input[type=hidden], link, menu[type=context], meta, noembed, noframes,
param, rp, script, source, style, track, title { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
display: none;
-}
+}</pre>
-address, article, aside, blockquote, body, center, dd, dir, div, dl,
-dt, figure, figcaption, footer, form, h1, h2, h3, h4, h5, h6, header,
-hgroup, hr, html, legend, listing, menu, nav, ol, p, plaintext, pre,
-section, summary, ul, xmp { display: block; unicode-bidi: isolate; }
-
-table { display: table; unicode-bidi: isolate; }
-caption { display: table-caption; unicode-bidi: isolate; }
-colgroup, colgroup[hidden] { display: table-column-group; unicode-bidi: isolate; }
-col, col[hidden] { display: table-column; unicode-bidi: isolate; }
-thead, thead[hidden] { display: table-header-group; unicode-bidi: isolate; }
-tbody, tbody[hidden] { display: table-row-group; unicode-bidi: isolate; }
-tfoot, tfoot[hidden] { display: table-footer-group; unicode-bidi: isolate; }
-tr, tr[hidden] { display: table-row; unicode-bidi: isolate; }
-td, th, td[hidden], th[hidden] { display: table-cell; unicode-bidi: isolate; }
-
-colgroup[hidden], col[hidden], thead[hidden], tbody[hidden],
-tfoot[hidden], tr[hidden], td[hidden], th[hidden] {
- visibility: collapse;
-}
-
-li { display: list-item; unicode-bidi: isolate; }
-
-ruby { display: ruby; }
-rt { display: ruby-text; }</pre>
-
- <!-- del, ins, and map are inline. -->
-
- <p>For the purposes of the CSS table model, the <code><a href=#the-col-element>col</a></code>
- element is expected to be treated as if it was present as many times
- as its <code title=attr-col-span><a href=#attr-col-span>span</a></code> attribute <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative
- integers">specifies</a>.</p>
-
- <p>For the purposes of the CSS table model, the
- <code><a href=#the-colgroup-element>colgroup</a></code> element, if it contains no <code><a href=#the-col-element>col</a></code>
- element, is expected to be treated as if it had as many such
- children as its <code title=attr-colgroup-span><a href=#attr-colgroup-span>span</a></code>
- attribute <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative
- integers">specifies</a>.</p>
-
- <p>For the purposes of the CSS table model, the <code title=attr-tdth-colspan><a href=#attr-tdth-colspan>colspan</a></code> and <code title=attr-tdth-rowspan><a href=#attr-tdth-rowspan>rowspan</a></code> attributes on
- <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements are expected to <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative integers">provide</a> the
- <i>special knowledge</i> regarding cells spanning rows and
- columns.</p>
-
- <p>For the purposes of the CSS ruby model, runs of children of
- <code><a href=#the-ruby-element>ruby</a></code> elements that are not <code><a href=#the-rt-element>rt</a></code> or
- <code><a href=#the-rp-element>rp</a></code> elements are expected to be wrapped in anonymous
- boxes whose 'display' property has the value 'ruby-base'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
-
- <p>User agents that do not support correct ruby rendering are
- expected to render parentheses around the text of <code><a href=#the-rt-element>rt</a></code>
- elements in the absence of <code><a href=#the-rp-element>rp</a></code> elements.</p>
-
<p>The user agent is expected to hide <code><a href=#the-noscript-element>noscript</a></code> elements
for whom <a href=#concept-n-script title=concept-n-script>scripting is enabled</a>,
irrespective of CSS rules.</p>
- <p>In <a href=#html-documents>HTML documents</a>, the user agent is expected to
- hide <code><a href=#the-form-element>form</a></code> elements that are children of
- <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
- <code><a href=#the-tfoot-element>tfoot</a></code>, or <code><a href=#the-tr-element>tr</a></code> elements, irrespective of CSS
- rules.</p>
- </div>
+ <h4 id=the-page><span class=secno>15.3.2 </span>The page</h4>
-
- <div class=impl>
-
- <h4 id=margins-and-padding><span class=secno>15.2.3 </span>Margins and padding</h4>
-
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-blockquote, dir, dl, figure, listing, menu, ol, p, plaintext,
-pre, ul, xmp {
- margin-top: 1em; margin-bottom: 1em;
-}
+html, body { display: block; }</pre>
-dir dir, dir dl, dir menu, dir ol, dir ul,
-dl dir, dl dl, dl menu, dl ol, dl ul,
-menu dir, menu dl, menu menu, menu ol, menu ul,
-ol dir, ol dl, ol menu, ol ol, ol ul,
-ul dir, ul dl, ul menu, ul ol, ul ul {
- margin-top: 0; margin-bottom: 0;
-}
-
-h1 { margin-top: 0.67em; margin-bottom: 0.67em; }
-h2 { margin-top: 0.83em; margin-bottom: 0.83em; }
-h3 { margin-top: 1.00em; margin-bottom: 1.00em; }
-h4 { margin-top: 1.33em; margin-bottom: 1.33em; }
-h5 { margin-top: 1.67em; margin-bottom: 1.67em; }
-h6 { margin-top: 2.33em; margin-bottom: 2.33em; }
-
-dd { margin-left: 40px; } /* <a href=#ltr-specific>LTR-specific</a>: use 'margin-right' for rtl elements */
-dir, menu, ol, ul { padding-left: 40px; } /* <a href=#ltr-specific>LTR-specific</a>: use 'padding-right' for rtl elements */
-blockquote, figure { margin-left: 40px; margin-right: 40px; }
-
-table { border-spacing: 2px; border-collapse: separate; }
-td, th { padding: 1px; }</pre>
-
- <p>The <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>,
- and <code><a href=#the-section-element>section</a></code> elements are expected to affect the margins
- of <code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h1</a></code> elements, based on the nesting depth. If <var title="">x</var> is a selector that matches elements that are either
- <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>, or
- <code><a href=#the-section-element>section</a></code> elements, then the following rules capture what
- is expected:</p>
-
- <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-
-<var title="">x</var> h1 { margin-top: 0.83em; margin-bottom: 0.83em; }
-<var title="">x</var> <var title="">x</var> h1 { margin-top: 1.00em; margin-bottom: 1.00em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.33em; margin-bottom: 1.33em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.67em; margin-bottom: 1.67em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 2.33em; margin-bottom: 2.33em; }</pre>
-
- <hr><p>For each property in the table below, given a <code><a href=#the-body-element>body</a></code>
+ <p>For each property in the table below, given a <code><a href=#the-body-element>body</a></code>
element, the first attribute that exists <a href=#maps-to-the-pixel-length-property>maps to the pixel
length property</a> on the <code><a href=#the-body-element>body</a></code> element. If none of
the attributes for a property are found, or if the value of the
@@ -91999,131 +91904,95 @@
<td>'hidden'
<tr><td><code title="">auto</code>
<td>'auto'
- </table><hr><p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-cellspacing><a href=#attr-table-cellspacing>cellspacing</a></code> attribute
- <a href=#maps-to-the-pixel-length-property>maps to the pixel length property</a> 'border-spacing' on the
- element.</p>
+ </table><hr><p>When a <code><a href=#document>Document</a></code> is in <a href=#quirks-mode>quirks mode</a>,
+ vertical margins on <a href=#html-elements>HTML elements</a> at the top or bottom
+ of <code><a href=#the-body-element>body</a></code> elements are expected to be collapsed to
+ zero.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-cellpadding><a href=#attr-table-cellpadding>cellpadding</a></code> attribute <a href=#maps-to-the-pixel-length-property title="maps to the pixel length property">maps to the pixel length
- properties</a> 'padding-top', 'padding-right', 'padding-bottom',
- and 'padding-left' of any <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code>
- elements that have corresponding <a href=#concept-cell title=concept-cell>cells</a> in the <a href=#concept-table title=concept-table>table</a> corresponding to the
- <code><a href=#the-table-element>table</a></code> element.</p>
+ <hr><p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-background><a href=#attr-background>background</a></code> attribute set to a
+ non-empty value, the new value is expected to be <a href=#resolve-a-url title="resolve a url">resolved</a> relative to the element, and
+ if this is successful, the user agent is expected to treat the
+ attribute as a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a> setting the element's 'background-image' property to the
+ resulting <a href=#absolute-url>absolute URL</a>.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-hspace>hspace</code> attribute <a href=#maps-to-the-dimension-property title="maps
- to the dimension property">maps to the dimension properties</a>
- 'margin-left' and 'margin-right' on the <code><a href=#the-table-element>table</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title="">bgcolor</code> attribute set, the new value is expected to
+ be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
+ value</a>, and if that does not return an error, the user agent
+ is expected to treat the attribute as a <a href=#presentational-hints title="presentational
+ hints">presentational hint</a> setting the element's
+ 'background-color' property to the resulting color.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-vspace>vspace</code> attribute <a href=#maps-to-the-dimension-property title="maps
- to the dimension property">maps to the dimension properties</a>
- 'margin-top' and 'margin-bottom' on the <code><a href=#the-table-element>table</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-text><a href=#attr-body-text>text</a></code> attribute, its value is expected
+ to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
+ value</a>, and if that does not return an error, the user
+ agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
+ element's 'color' property to the resulting color.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-height>height</code> attribute <a href=#maps-to-the-dimension-property>maps to the
- dimension property</a> 'height' on the <code><a href=#the-table-element>table</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-link><a href=#attr-body-link>link</a></code> attribute, its value is expected
+ to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
+ value</a>, and if that does not return an error, the user agent
+ is expected to treat the attribute as a <a href=#presentational-hints title="presentational
+ hints">presentational hint</a> setting the 'color' property of
+ any element in the <code><a href=#document>Document</a></code> matching the ':link'
+ pseudo-class to the resulting color.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-width><a href=#attr-table-width>width</a></code> attribute <a href=#maps-to-the-dimension-property>maps to the
- dimension property</a> 'width' on the <code><a href=#the-table-element>table</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-vlink><a href=#attr-body-vlink>vlink</a></code> attribute, its value is
+ expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
+ color value</a>, and if that does not return an error, the user
+ agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
+ 'color' property of any element in the <code><a href=#document>Document</a></code>
+ matching the ':visited' pseudo-class to the resulting color.</p>
- <p>The <code><a href=#the-col-element>col</a></code> element's <code title=attr-col-width><a href=#attr-col-width>width</a></code> attribute <a href=#maps-to-the-dimension-property>maps to the
- dimension property</a> 'width' on the <code><a href=#the-col-element>col</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-alink><a href=#attr-body-alink>alink</a></code> attribute, its value is
+ expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
+ color value</a>, and if that does not return an error, the user
+ agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
+ 'color' property of any element in the <code><a href=#document>Document</a></code>
+ matching the ':active' pseudo-class and either the ':link'
+ pseudo-class or the ':visited' pseudo-class to the resulting
+ color.</p>
- <p>The <code><a href=#the-tr-element>tr</a></code> element's <code title=attr-tr-height>height</code> attribute <a href=#maps-to-the-dimension-property>maps to the
- dimension property</a> 'height' on the <code><a href=#the-tr-element>tr</a></code>
- element.</p>
- <p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-height><a href=#attr-tdth-height>height</a></code> attributes <a href=#maps-to-the-dimension-property title="maps
- to the dimension property">map to the dimension property</a> 'height'
- on the element.</p>
- <p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-width><a href=#attr-tdth-width>width</a></code> attributes <a href=#maps-to-the-dimension-property title="maps
- to the dimension property">map to the dimension property</a> 'width'
- on the element.</p>
+ <h4 id=flow-content-1><span class=secno>15.3.3 </span>Flow content</h4>
- <hr><p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
- expected to apply:</p>
+ <!-- del, ins, and map are inline. -->
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-form { margin-bottom: 1em; }</pre>
+address, blockquote, center, div, figure, figcaption, footer, form,
+header, hr, legend, listing, p, plaintext, pre, summary, xmp {
+ display: block; unicode-bidi: isolate;
+}
- <p>When a <code><a href=#document>Document</a></code> is in <a href=#quirks-mode>quirks mode</a>,
- vertical margins on <a href=#html-elements>HTML elements</a> at the top or bottom
- of <code><a href=#the-body-element>body</a></code>, <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> elements
- are expected to be collapsed to zero.</p>
+blockquote, figure, listing, p, plaintext, pre, xmp {
+ margin-top: 1em; margin-bottom: 1em;
+}
- </div>
+blockquote, figure { margin-left: 40px; margin-right: 40px; }
+address { font-style: italic; }
+listing, plaintext, pre, xmp {
+ font-family: monospace; white-space: pre;
+}</pre>
- <div class=impl>
+ <p>The following rules are also expected to apply, as
+ <a href=#presentational-hints>presentational hints</a>:</p>
- <h4 id=alignment><span class=secno>15.2.4 </span>Alignment</h4>
-
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-thead, tbody, tfoot, table > tr { vertical-align: middle; }
-tr, td, th { vertical-align: inherit; }
-sub { vertical-align: sub; }
-sup { vertical-align: super; }</pre>
+pre[wrap] { white-space: pre-wrap; }</pre>
- <hr><p>The following rules are also expected to apply, as
- <a href=#presentational-hints>presentational hints</a>:</p>
+ <p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
+ expected to apply:</p>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-table[align=left] { float: left; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-table[align=right] { float: right; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-table[align=center], table[align=abscenter],
-table[align=absmiddle], table[align=middle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- margin-left: auto; margin-right: auto;
-}
-thead[align=absmiddle], tbody[align=absmiddle], tfoot[align=absmiddle],
-tr[align=absmiddle], td[align=absmiddle], th[align=absmiddle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: center;
-}
+form { margin-bottom: 1em; }</pre>
-caption[align=bottom] { caption-side: bottom; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-p[align=left], h1[align=left], h2[align=left], h3[align=left],
-h4[align=left], h5[align=left], h6[align=left] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: left;
-}
-p[align=right], h1[align=right], h2[align=right], h3[align=right],
-h4[align=right], h5[align=right], h6[align=right] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: right;
-}
-p[align=center], h1[align=center], h2[align=center], h3[align=center],
-h4[align=center], h5[align=center], h6[align=center] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: center;
-}
-p[align=justify], h1[align=justify], h2[align=justify], h3[align=justify],
-h4[align=justify], h5[align=justify], h6[align=justify] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: justify;
-}
-thead[valign=top], tbody[valign=top], tfoot[valign=top],
-tr[valign=top], td[valign=top], th[valign=top] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- vertical-align: top;
-}
-thead[valign=middle], tbody[valign=middle], tfoot[valign=middle],
-tr[valign=middle], td[valign=middle], th[valign=middle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- vertical-align: middle;
-}
-thead[valign=bottom], tbody[valign=bottom], tfoot[valign=bottom],
-tr[valign=bottom], td[valign=bottom], th[valign=bottom] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- vertical-align: bottom;
-}
-thead[valign=baseline], tbody[valign=baseline], tfoot[valign=baseline],
-tr[valign=baseline], td[valign=baseline], th[valign=baseline] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- vertical-align: baseline;
-}</pre>
-
- <p>The <code><a href=#center>center</a></code> element, the <code><a href=#the-caption-element>caption</a></code> element
- unless specified otherwise below, and the <code><a href=#the-div-element>div</a></code>,
- <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>,
- <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements when
- they have an <code title=attr-div-align><a href=#attr-div-align>align</a></code> attribute
+ <hr><p>The <code><a href=#center>center</a></code> element, and the <code><a href=#the-div-element>div</a></code> element
+ when it has an <code title=attr-div-align><a href=#attr-div-align>align</a></code> attribute
whose value is an <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for
either the string "<code title="">center</code>" or the string
"<code title="">middle</code>", are expected to center text within
@@ -92132,183 +92001,97 @@
hint</a>, and to <a href=#align-descendants>align descendants</a> to the
center.</p>
- <p>The <code><a href=#the-div-element>div</a></code>, <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements, when they have an
- <code title=attr-align>align</code> attribute whose value is an
- <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">left</code>", are expected to left-align text within
- themselves, as if they had their 'text-align' property set to 'left'
- in a <a href=#presentational-hints title="presentational hints">presentational hint</a>,
- and to <a href=#align-descendants>align descendants</a> to the left.</p>
+ <p>The <code><a href=#the-div-element>div</a></code> element, when it has an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">left</code>", is expected to left-align text within itself,
+ as if it had its 'text-align' property set to 'left' in a <a href=#presentational-hints title="presentational hints">presentational hint</a>, and to
+ <a href=#align-descendants>align descendants</a> to the left.</p>
- <p>The <code><a href=#the-div-element>div</a></code>, <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements, when they have an
- <code title=attr-align>align</code> attribute whose value is an
- <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">right</code>", are expected to right-align text within
- themselves, as if they had their 'text-align' property set to
- 'right' in a <a href=#presentational-hints title="presentational hints">presentational
- hint</a>, and to <a href=#align-descendants>align descendants</a> to the right.</p>
+ <p>The <code><a href=#the-div-element>div</a></code> element, when it has an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">right</code>", is expected to right-align text within
+ itself, as if it had its 'text-align' property set to 'right' in a
+ <a href=#presentational-hints title="presentational hints">presentational hint</a>, and
+ to <a href=#align-descendants>align descendants</a> to the right.</p>
- <p>The <code><a href=#the-div-element>div</a></code>, <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements, when they have an
- <code title=attr-align>align</code> attribute whose value is an
- <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">justify</code>", are expected to full-justify text within
- themselves, as if they had their 'text-align' property set to
- 'justify' in a <a href=#presentational-hints title="presentational hints">presentational
- hint</a>, and to <a href=#align-descendants>align descendants</a> to the left.</p>
+ <p>The <code><a href=#the-div-element>div</a></code> element, when it has an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">justify</code>", is expected to full-justify text within
+ itself, as if it had its 'text-align' property set to 'justify' in a
+ <a href=#presentational-hints title="presentational hints">presentational hint</a>, and
+ to <a href=#align-descendants>align descendants</a> to the left.</p>
- <p>When a user agent is to <dfn id=align-descendants>align descendants</dfn> of a node,
- the user agent is expected to align only those descendants that have
- both their 'margin-left' and 'margin-right' properties computing to
- a value other than 'auto', that are over-constrained and that have
- one of those two margins with a used value forced to a greater
- value, and that do not themselves have an applicable <code title=attr-align>align</code> attribute. When multiple elements
- are to <a href=#align-descendants title="align descendants">align</a> a particular
- descendant, the most deeply nested such element is expected to
- override the others.</p>
- <p>User agents are expected to have a rule in their user agent
- stylesheet that matches <code><a href=#the-th-element>th</a></code> elements that have a parent
- node whose computed value for the 'text-align' property is its
- initial value, whose declaration block consists of just a single
- declaration that sets the 'text-align' property to the value
- 'center'.</p> <!-- q.v. '-moz-center-or-inherit' -->
- </div>
+ <h4 id=phrasing-content-1><span class=secno>15.3.4 </span>Phrasing content</h4>
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
- <div class=impl>
+cite, dfn, em, i, var { font-style: italic; }
+b, strong { font-weight: bold; }
+code, kbd, samp, tt { font-family: monospace; }
+big { font-size: larger; }
+small { font-size: smaller; }
- <h4 id=fonts-and-colors><span class=secno>15.2.5 </span>Fonts and colors</h4>
+sub { vertical-align: sub; }
+sup { vertical-align: super; }
+sub, sup { line-height: normal; font-size: smaller; }
- <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+ruby { display: ruby; }
+rt { display: ruby-text; }
-address, cite, dfn, em, i, var { font-style: italic; }
-b, strong, th { font-weight: bold; }
-code, kbd, listing, plaintext, pre, samp, tt, xmp { font-family: monospace; }
-h1 { font-size: 2.00em; font-weight: bold; }
-h2 { font-size: 1.50em; font-weight: bold; }
-h3 { font-size: 1.17em; font-weight: bold; }
-h4 { font-size: 1.00em; font-weight: bold; }
-h5 { font-size: 0.83em; font-weight: bold; }
-h6 { font-size: 0.67em; font-weight: bold; }
-big { font-size: larger; }
-small, sub, sup { font-size: smaller; }
-sub, sup { line-height: normal; }
-
:link { color: blue; }
:visited { color: purple; }
+:link, :visited { text-decoration: underline; }
+
+:focus { outline: auto; }
+
mark { background: yellow; color: black; }
-table, td, th { border-color: gray; }
-thead, tbody, tfoot, tr { border-color: inherit; }
-table[rules=none], table[rules=groups], table[rules=rows],
-table[rules=cols], table[rules=all], table[frame=void],
-table[frame=above], table[frame=below], table[frame=hsides],
-table[frame=lhs], table[frame=rhs], table[frame=vsides],
-table[frame=box], table[frame=border],
-table[rules=none] > tr > td, table[rules=none] > tr > th,
-table[rules=groups] > tr > td, table[rules=groups] > tr > th,
-table[rules=rows] > tr > td, table[rules=rows] > tr > th,
-table[rules=cols] > tr > td, table[rules=cols] > tr > th,
-table[rules=all] > tr > td, table[rules=all] > tr > th,
-table[rules=none] > thead > tr > td, table[rules=none] > thead > tr > th,
-table[rules=groups] > thead > tr > td, table[rules=groups] > thead > tr > th,
-table[rules=rows] > thead > tr > td, table[rules=rows] > thead > tr > th,
-table[rules=cols] > thead > tr > td, table[rules=cols] > thead > tr > th,
-table[rules=all] > thead > tr > td, table[rules=all] > thead > tr > th,
-table[rules=none] > tbody > tr > td, table[rules=none] > tbody > tr > th,
-table[rules=groups] > tbody > tr > td, table[rules=groups] > tbody > tr > th,
-table[rules=rows] > tbody > tr > td, table[rules=rows] > tbody > tr > th,
-table[rules=cols] > tbody > tr > td, table[rules=cols] > tbody > tr > th,
-table[rules=all] > tbody > tr > td, table[rules=all] > tbody > tr > th,
-table[rules=none] > tfoot > tr > td, table[rules=none] > tfoot > tr > th,
-table[rules=groups] > tfoot > tr > td, table[rules=groups] > tfoot > tr > th,
-table[rules=rows] > tfoot > tr > td, table[rules=rows] > tfoot > tr > th,
-table[rules=cols] > tfoot > tr > td, table[rules=cols] > tfoot > tr > th,
-table[rules=all] > tfoot > tr > td, table[rules=all] > tfoot > tr > th { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- border-color: black;
-}</pre>
+abbr[title], acronym[title] { text-decoration: dotted underline; }<!-- CSS3 http://dev.w3.org/csswg/css3-text/#text-decoration-style -->
+ins, u { text-decoration: underline; }
+del, s, strike { text-decoration: line-through; }
+blink { text-decoration: blink; }
- <hr><p>The initial value for the 'color' property is expected to be
- black. The initial value for the 'background-color' property is
- expected to be 'transparent'. The canvas' background is expected to
- be white.</p>
+q::before { content: open-quote; }
+q::after { content: close-quote; }
- <hr><p>The <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>,
- and <code><a href=#the-section-element>section</a></code> elements are expected to affect the font
- size of <code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h1</a></code> elements, based on the nesting depth. If
- <var title="">x</var> is a selector that matches elements that are
- either <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>,
- or <code><a href=#the-section-element>section</a></code> elements, then the following rules capture
- what is expected:</p>
+br { content: '\A'; white-space: pre; }
+nobr { white-space: nowrap; }</pre>
+ <p>The following rules are also expected to apply, as
+ <a href=#presentational-hints>presentational hints</a>:</p>
+
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-<var title="">x</var> h1 { font-size: 1.50em; }
-<var title="">x</var> <var title="">x</var> h1 { font-size: 1.17em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { font-size: 1.00em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { font-size: 0.83em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { font-size: 0.67em; }</pre>
+br[clear=left] { clear: left; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+br[clear=right] { clear: right; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+br[clear=all], br[clear=both] { clear: both; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */</pre>
- <hr><p>When a <code><a href=#the-body-element>body</a></code>, <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> element has a <code title=attr-background><a href=#attr-background>background</a></code> attribute set to a
- non-empty value, the new value is expected to be <a href=#resolve-a-url title="resolve a url">resolved</a> relative to the element, and
- if this is successful, the user agent is expected to treat the
- attribute as a <a href=#presentational-hints title="presentational hints">presentational
- hint</a> setting the element's 'background-image' property to the
- resulting <a href=#absolute-url>absolute URL</a>.</p>
+ <p>For the purposes of the CSS ruby model, runs of children of
+ <code><a href=#the-ruby-element>ruby</a></code> elements that are not <code><a href=#the-rt-element>rt</a></code> or
+ <code><a href=#the-rp-element>rp</a></code> elements are expected to be wrapped in anonymous
+ boxes whose 'display' property has the value 'ruby-base'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
- <p>When a <code><a href=#the-body-element>body</a></code>, <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> element has a <code title="">bgcolor</code> attribute set, the new value is expected to
- be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
- value</a>, and if that does not return an error, the user agent
- is expected to treat the attribute as a <a href=#presentational-hints title="presentational
- hints">presentational hint</a> setting the element's
- 'background-color' property to the resulting color.</p>
+ <p>User agents that do not support correct ruby rendering are
+ expected to render parentheses around the text of <code><a href=#the-rt-element>rt</a></code>
+ elements in the absence of <code><a href=#the-rp-element>rp</a></code> elements.</p>
- <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-text><a href=#attr-body-text>text</a></code> attribute, its value is expected
- to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
- value</a>, and if that does not return an error, the user
- agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
- element's 'color' property to the resulting color.</p>
+ <p>Rules setting the 'quotes' property appropriately for the locales
+ and languages understood by the user are expected to be present.</p>
- <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-link><a href=#attr-body-link>link</a></code> attribute, its value is expected
- to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
- value</a>, and if that does not return an error, the user agent
- is expected to treat the attribute as a <a href=#presentational-hints title="presentational
- hints">presentational hint</a> setting the 'color' property of
- any element in the <code><a href=#document>Document</a></code> matching the ':link'
- pseudo-class to the resulting color.</p>
+ <hr><p>User agents are expected to
+ support the 'clear' property on inline elements (in order to render
+ <code><a href=#the-br-element>br</a></code> elements with <code title=attr-br-clear><a href=#attr-br-clear>clear</a></code> attributes) in the manner
+ described in the non-normative note to this effect in CSS2.1.</p>
+ <!-- section 9.5.2 of CSS2.1 -->
- <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-vlink><a href=#attr-body-vlink>vlink</a></code> attribute, its value is
- expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
- color value</a>, and if that does not return an error, the user
- agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
- 'color' property of any element in the <code><a href=#document>Document</a></code>
- matching the ':visited' pseudo-class to the resulting color.</p>
+ <p>The <code><a href=#the-wbr-element>wbr</a></code> element is expected to override the
+ 'white-space' property and always provide a line-breaking
+ opportunity.</p>
- <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-alink><a href=#attr-body-alink>alink</a></code> attribute, its value is
- expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
- color value</a>, and if that does not return an error, the user
- agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
- 'color' property of any element in the <code><a href=#document>Document</a></code>
- matching the ':active' pseudo-class and either the ':link'
- pseudo-class or the ':visited' pseudo-class to the resulting
- color.</p>
+ <p>The initial value for the 'color' property is expected to be
+ black. The initial value for the 'background-color' property is
+ expected to be 'transparent'. The canvas' background is expected to
+ be white.</p>
- <p>When a <code><a href=#the-table-element>table</a></code> element has a <code title=attr-table-bordercolor>bordercolor</code> attribute, its
- value is expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a
- legacy color value</a>, and if that does not return an error, the
- user agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
- element's 'border-top-color', 'border-right-color',
- 'border-bottom-color', and 'border-right-color' properties to the
- resulting color.</p>
-
<hr><p>When a <code><a href=#font>font</a></code> element has a <code title=attr-font-color>color</code> attribute, its value is
expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
color value</a>, and if that does not return an error, the user
@@ -92419,37 +92202,76 @@
</li>
- </ol></div>
+ </ol><h4 id=bidirectional-text><span class=secno>15.3.5 </span>Bidirectional text</h4>
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
- <div class=impl>
+:ltr { direction: ltr; }
+:rtl { direction: rtl; }
+[dir] { unicode-bidi: embed; }
+bdi, output, [dir=auto] { unicode-bidi: isolate; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+bdo, bdo[dir] { unicode-bidi: bidi-override; }
+bdo[dir=auto] { unicode-bidi: bidi-override isolate; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+textarea[dir=auto], pre[dir=auto] { unicode-bidi: plaintext; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */</pre>
- <h4 id=punctuation-and-decorations><span class=secno>15.2.6 </span>Punctuation and decorations</h4>
+ <h4 id=sections-and-headings><span class=secno>15.3.6 </span>Sections and headings</h4>
+
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-:link, :visited, ins, u { text-decoration: underline; }
-abbr[title], acronym[title] { text-decoration: dotted underline; }<!-- CSS3 http://dev.w3.org/csswg/css3-text/#text-decoration-style -->
-del, s, strike { text-decoration: line-through; }
-blink { text-decoration: blink; }
+article, aside, h1, h2, h3, h4, h5, h6, hgroup, nav, section {
+ display: block; unicode-bidi: isolate;
+}
-:focus { outline: auto; }
+h1 { margin-top: 0.67em; margin-bottom: 0.67em; font-size: 2.00em; font-weight: bold; }
+h2 { margin-top: 0.83em; margin-bottom: 0.83em; font-size: 1.50em; font-weight: bold; }
+h3 { margin-top: 1.00em; margin-bottom: 1.00em; font-size: 1.17em; font-weight: bold; }
+h4 { margin-top: 1.33em; margin-bottom: 1.33em; font-size: 1.00em; font-weight: bold; }
+h5 { margin-top: 1.67em; margin-bottom: 1.67em; font-size: 0.83em; font-weight: bold; }
+h6 { margin-top: 2.33em; margin-bottom: 2.33em; font-size: 0.67em; font-weight: bold; }</pre>
-q:before { content: open-quote; }
-q:after { content: close-quote; }
+ <p>The <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>,
+ and <code><a href=#the-section-element>section</a></code> elements are expected to affect the margins
+ and font size of <code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h1</a></code> elements, based on the nesting
+ depth. If <var title="">x</var> is a selector that matches elements
+ that are either <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>,
+ <code><a href=#the-nav-element>nav</a></code>, or <code><a href=#the-section-element>section</a></code> elements, then the
+ following rules capture what is expected:</p>
-br { content: '\A'; white-space: pre; }
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-nobr { white-space: nowrap; }
-listing, plaintext, pre, xmp { white-space: pre; }
-textarea { white-space: pre-wrap; }
+<var title="">x</var> h1 { margin-top: 0.83em; margin-bottom: 0.83em; font-size: 1.50em; }
+<var title="">x</var> <var title="">x</var> h1 { margin-top: 1.00em; margin-bottom: 1.00em; font-size: 1.17em; }
+<var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.33em; margin-bottom: 1.33em; font-size: 1.00em; }
+<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.67em; margin-bottom: 1.67em; font-size: 0.83em; }
+<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 2.33em; margin-bottom: 2.33em; font-size: 0.67em; }</pre>
-ol { list-style-type: decimal; }
-dir, menu, ul {
- list-style-type: disc;
+
+ <h4 id=lists><span class=secno>15.3.7 </span>Lists</h4>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+dir, dd, dl, dt, menu, ol, ul { display: block; unicode-bidi: isolate; }
+li { display: list-item; unicode-bidi: isolate; }
+
+dir, dl, menu, ol, ul { margin-top: 1em; margin-bottom: 1em; }
+
+dir dir, dir dl, dir menu, dir ol, dir ul,
+dl dir, dl dl, dl menu, dl ol, dl ul,
+menu dir, menu dl, menu menu, menu ol, menu ul,
+ol dir, ol dl, ol menu, ol ol, ol ul,
+ul dir, ul dl, ul menu, ul ol, ul ul {
+ margin-top: 0; margin-bottom: 0;
}
+dd { margin-left: 40px; } /* <a href=#ltr-specific>LTR-specific</a>: use 'margin-right' for rtl elements */
+dir, menu, ol, ul { padding-left: 40px; } /* <a href=#ltr-specific>LTR-specific</a>: use 'padding-right' for rtl elements */
+
+ol { list-style-type: decimal; }
+
+dir, menu, ul { list-style-type: disc; }
+
dir dl, dir menu, dir ul,
menu dl, menu menu, menu ul,
ol dl, ol menu, ol ul,
@@ -92474,40 +92296,13 @@
ul ol dl, ul ol menu, ul ol ul,
ul ul dl, ul ul menu, ul ul ul {
list-style-type: square;
-}
+}</pre>
-table { border-style: outset; }
-td, th { border-style: inset; }
-
-:ltr { direction: ltr; }
-:rtl { direction: rtl; }
-[dir] { unicode-bidi: embed; }
-bdi, output, [dir=auto] { unicode-bidi: isolate; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-bdo, bdo[dir] { unicode-bidi: bidi-override; }
-bdo[dir=auto] { unicode-bidi: bidi-override isolate; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-textarea[dir=auto], pre[dir=auto] { unicode-bidi: plaintext; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */</pre>
-
- <p>Rules setting the 'quotes' property appropriately for the locales
- and languages understood by the user are expected to be present.</p>
-
- <p>User agents are expected to
- support the 'clear' property on inline elements (in order to render
- <code><a href=#the-br-element>br</a></code> elements with <code title=attr-br-clear><a href=#attr-br-clear>clear</a></code> attributes) in the manner
- described in the non-normative note to this effect in CSS2.1.</p>
- <!-- section 9.5.2 of CSS2.1 -->
-
- <hr><p id=decohints>The following rules are also expected to apply, as
+ <p>The following rules are also expected to apply, as
<a href=#presentational-hints>presentational hints</a>:</p>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-td[nowrap], th[nowrap] { white-space: nowrap; }
-pre[wrap] { white-space: pre-wrap; }
-
-br[clear=left] { clear: left; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-br[clear=right] { clear: right; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-br[clear=all], br[clear=both] { clear: both; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-
ol[type=1], li[type=1] { list-style-type: decimal; }
ol[type=a], li[type=a] { list-style-type: lower-alpha; }<!-- /* <a href="#case-sensitive-selector-exception">case-sensitive</a> */ -->
ol[type=A], li[type=A] { list-style-type: upper-alpha; }<!-- /* <a href="#case-sensitive-selector-exception">case-sensitive</a> */ -->
@@ -92515,9 +92310,128 @@
ol[type=I], li[type=I] { list-style-type: upper-roman; }<!-- /* <a href="#case-sensitive-selector-exception">case-sensitive</a> */ -->
ul[type=disc], li[type=disc] { list-style-type: disc; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
ul[type=circle], li[type=circle] { list-style-type: circle; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-ul[type=square], li[type=square] { list-style-type: square; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ul[type=square], li[type=square] { list-style-type: square; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */</pre>
+ <p>When rendering <code><a href=#the-li-element>li</a></code> elements, user agents are expected
+ to use the <a href=#ordinal-value>ordinal value</a> of the <code><a href=#the-li-element>li</a></code> element
+ to render the counter in the list item marker.</p>
+
+
+ <h4 id=tables><span class=secno>15.3.8 </span>Tables</h4>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+table { display: table; unicode-bidi: isolate; }
+caption { display: table-caption; unicode-bidi: isolate; }
+colgroup, colgroup[hidden] { display: table-column-group; unicode-bidi: isolate; }
+col, col[hidden] { display: table-column; unicode-bidi: isolate; }
+thead, thead[hidden] { display: table-header-group; unicode-bidi: isolate; }
+tbody, tbody[hidden] { display: table-row-group; unicode-bidi: isolate; }
+tfoot, tfoot[hidden] { display: table-footer-group; unicode-bidi: isolate; }
+tr, tr[hidden] { display: table-row; unicode-bidi: isolate; }
+td, th, td[hidden], th[hidden] { display: table-cell; unicode-bidi: isolate; }
+
+colgroup[hidden], col[hidden], thead[hidden], tbody[hidden],
+tfoot[hidden], tr[hidden], td[hidden], th[hidden] {
+ visibility: collapse;
+}
+
+table {
+ border-spacing: 2px;
+ border-collapse: separate;
+ border-style: outset;
+ text-indent: initial;
+}
+
+td, th { padding: 1px; border-style: inset; }
+th { font-weight: bold; }
+
+thead, tbody, tfoot, table > tr { vertical-align: middle; }
+tr, td, th { vertical-align: inherit; }
+
+table, td, th { border-color: gray; }
+thead, tbody, tfoot, tr { border-color: inherit; }
table[rules=none], table[rules=groups], table[rules=rows],
+table[rules=cols], table[rules=all], table[frame=void],
+table[frame=above], table[frame=below], table[frame=hsides],
+table[frame=lhs], table[frame=rhs], table[frame=vsides],
+table[frame=box], table[frame=border],
+table[rules=none] > tr > td, table[rules=none] > tr > th,
+table[rules=groups] > tr > td, table[rules=groups] > tr > th,
+table[rules=rows] > tr > td, table[rules=rows] > tr > th,
+table[rules=cols] > tr > td, table[rules=cols] > tr > th,
+table[rules=all] > tr > td, table[rules=all] > tr > th,
+table[rules=none] > thead > tr > td, table[rules=none] > thead > tr > th,
+table[rules=groups] > thead > tr > td, table[rules=groups] > thead > tr > th,
+table[rules=rows] > thead > tr > td, table[rules=rows] > thead > tr > th,
+table[rules=cols] > thead > tr > td, table[rules=cols] > thead > tr > th,
+table[rules=all] > thead > tr > td, table[rules=all] > thead > tr > th,
+table[rules=none] > tbody > tr > td, table[rules=none] > tbody > tr > th,
+table[rules=groups] > tbody > tr > td, table[rules=groups] > tbody > tr > th,
+table[rules=rows] > tbody > tr > td, table[rules=rows] > tbody > tr > th,
+table[rules=cols] > tbody > tr > td, table[rules=cols] > tbody > tr > th,
+table[rules=all] > tbody > tr > td, table[rules=all] > tbody > tr > th,
+table[rules=none] > tfoot > tr > td, table[rules=none] > tfoot > tr > th,
+table[rules=groups] > tfoot > tr > td, table[rules=groups] > tfoot > tr > th,
+table[rules=rows] > tfoot > tr > td, table[rules=rows] > tfoot > tr > th,
+table[rules=cols] > tfoot > tr > td, table[rules=cols] > tfoot > tr > th,
+table[rules=all] > tfoot > tr > td, table[rules=all] > tfoot > tr > th { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ border-color: black;
+}</pre>
+
+ <p>The following rules are also expected to apply, as
+ <a href=#presentational-hints>presentational hints</a>:</p>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+table[align=left] { float: left; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+table[align=right] { float: right; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+table[align=center], table[align=abscenter],
+table[align=absmiddle], table[align=middle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ margin-left: auto; margin-right: auto;
+}
+thead[align=absmiddle], tbody[align=absmiddle], tfoot[align=absmiddle],
+tr[align=absmiddle], td[align=absmiddle], th[align=absmiddle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: center;
+}
+
+caption[align=bottom] { caption-side: bottom; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+p[align=left], h1[align=left], h2[align=left], h3[align=left],
+h4[align=left], h5[align=left], h6[align=left] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: left;
+}
+p[align=right], h1[align=right], h2[align=right], h3[align=right],
+h4[align=right], h5[align=right], h6[align=right] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: right;
+}
+p[align=center], h1[align=center], h2[align=center], h3[align=center],
+h4[align=center], h5[align=center], h6[align=center] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: center;
+}
+p[align=justify], h1[align=justify], h2[align=justify], h3[align=justify],
+h4[align=justify], h5[align=justify], h6[align=justify] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: justify;
+}
+thead[valign=top], tbody[valign=top], tfoot[valign=top],
+tr[valign=top], td[valign=top], th[valign=top] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ vertical-align: top;
+}
+thead[valign=middle], tbody[valign=middle], tfoot[valign=middle],
+tr[valign=middle], td[valign=middle], th[valign=middle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ vertical-align: middle;
+}
+thead[valign=bottom], tbody[valign=bottom], tfoot[valign=bottom],
+tr[valign=bottom], td[valign=bottom], th[valign=bottom] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ vertical-align: bottom;
+}
+thead[valign=baseline], tbody[valign=baseline], tfoot[valign=baseline],
+tr[valign=baseline], td[valign=baseline], th[valign=baseline] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ vertical-align: baseline;
+}
+
+td[nowrap], th[nowrap] { white-space: nowrap; }
+
+table[rules=none], table[rules=groups], table[rules=rows],
table[rules=cols], table[rules=all] {
border-style: none;
border-collapse: collapse;
@@ -92579,11 +92493,162 @@
border-width: 1px;
}</pre>
- <p>When rendering <code><a href=#the-li-element>li</a></code> elements, user agents are expected
- to use the <a href=#ordinal-value>ordinal value</a> of the <code><a href=#the-li-element>li</a></code> element
- to render the counter in the list item marker.</p>
+ <p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
+ expected to apply:</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-border><a href=#attr-table-border>border</a></code> attribute <a href=#maps-to-the-pixel-length-property title="maps
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+table {
+ font-weight: initial;
+ font-style: initial;
+ font-variant: initial;
+ font-size: initial;
+ line-height: initial;
+ white-space: initial;
+ text-align: initial;
+}</pre>
+
+ <hr><p>For the purposes of the CSS table model, the <code><a href=#the-col-element>col</a></code>
+ element is expected to be treated as if it was present as many times
+ as its <code title=attr-col-span><a href=#attr-col-span>span</a></code> attribute <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative
+ integers">specifies</a>.</p>
+
+ <p>For the purposes of the CSS table model, the
+ <code><a href=#the-colgroup-element>colgroup</a></code> element, if it contains no <code><a href=#the-col-element>col</a></code>
+ element, is expected to be treated as if it had as many such
+ children as its <code title=attr-colgroup-span><a href=#attr-colgroup-span>span</a></code>
+ attribute <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative
+ integers">specifies</a>.</p>
+
+ <p>For the purposes of the CSS table model, the <code title=attr-tdth-colspan><a href=#attr-tdth-colspan>colspan</a></code> and <code title=attr-tdth-rowspan><a href=#attr-tdth-rowspan>rowspan</a></code> attributes on
+ <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements are expected to <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative integers">provide</a> the
+ <i>special knowledge</i> regarding cells spanning rows and
+ columns.</p>
+
+ <p>In <a href=#html-documents>HTML documents</a>, the user agent is expected to
+ hide <code><a href=#the-form-element>form</a></code> elements that are children of
+ <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, or <code><a href=#the-tr-element>tr</a></code> elements, irrespective of CSS
+ rules.</p>
+
+ <hr><p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-cellspacing><a href=#attr-table-cellspacing>cellspacing</a></code> attribute
+ <a href=#maps-to-the-pixel-length-property>maps to the pixel length property</a> 'border-spacing' on the
+ element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-cellpadding><a href=#attr-table-cellpadding>cellpadding</a></code> attribute <a href=#maps-to-the-pixel-length-property title="maps to the pixel length property">maps to the pixel length
+ properties</a> 'padding-top', 'padding-right', 'padding-bottom',
+ and 'padding-left' of any <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code>
+ elements that have corresponding <a href=#concept-cell title=concept-cell>cells</a> in the <a href=#concept-table title=concept-table>table</a> corresponding to the
+ <code><a href=#the-table-element>table</a></code> element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-hspace>hspace</code> attribute <a href=#maps-to-the-dimension-property title="maps
+ to the dimension property">maps to the dimension properties</a>
+ 'margin-left' and 'margin-right' on the <code><a href=#the-table-element>table</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-vspace>vspace</code> attribute <a href=#maps-to-the-dimension-property title="maps
+ to the dimension property">maps to the dimension properties</a>
+ 'margin-top' and 'margin-bottom' on the <code><a href=#the-table-element>table</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-height>height</code> attribute <a href=#maps-to-the-dimension-property>maps to the
+ dimension property</a> 'height' on the <code><a href=#the-table-element>table</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-width><a href=#attr-table-width>width</a></code> attribute <a href=#maps-to-the-dimension-property>maps to the
+ dimension property</a> 'width' on the <code><a href=#the-table-element>table</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-col-element>col</a></code> element's <code title=attr-col-width><a href=#attr-col-width>width</a></code> attribute <a href=#maps-to-the-dimension-property>maps to the
+ dimension property</a> 'width' on the <code><a href=#the-col-element>col</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-tr-element>tr</a></code> element's <code title=attr-tr-height>height</code> attribute <a href=#maps-to-the-dimension-property>maps to the
+ dimension property</a> 'height' on the <code><a href=#the-tr-element>tr</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-height><a href=#attr-tdth-height>height</a></code> attributes <a href=#maps-to-the-dimension-property title="maps
+ to the dimension property">map to the dimension property</a> 'height'
+ on the element.</p>
+
+ <p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-width><a href=#attr-tdth-width>width</a></code> attributes <a href=#maps-to-the-dimension-property title="maps
+ to the dimension property">map to the dimension property</a> 'width'
+ on the element.</p>
+
+ <p>When a <code><a href=#document>Document</a></code> is in <a href=#quirks-mode>quirks mode</a>,
+ vertical margins on <a href=#html-elements>HTML elements</a> at the top or bottom
+ of <code><a href=#the-td-element>td</a></code> or <code><a href=#the-th-element>th</a></code> elements are expected to be
+ collapsed to zero.</p>
+
+ <hr><p>The the <code><a href=#the-caption-element>caption</a></code> element unless specified otherwise
+ below, and the <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and
+ <code><a href=#the-th-element>th</a></code> elements when they have an <code title=attr-div-align><a href=#attr-div-align>align</a></code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for either the string
+ "<code title="">center</code>" or the string "<code title="">middle</code>", are expected to center text within
+ themselves, as if they had their 'text-align' property set to
+ 'center' in a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a>, and to <a href=#align-descendants>align descendants</a> to the
+ center.</p>
+
+ <p>The <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and
+ <code><a href=#the-th-element>th</a></code> elements, when they have an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">left</code>", are expected to left-align text within
+ themselves, as if they had their 'text-align' property set to 'left'
+ in a <a href=#presentational-hints title="presentational hints">presentational hint</a>,
+ and to <a href=#align-descendants>align descendants</a> to the left.</p>
+
+ <p>The <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and
+ <code><a href=#the-th-element>th</a></code> elements, when they have an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">right</code>", are expected to right-align text within
+ themselves, as if they had their 'text-align' property set to
+ 'right' in a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a>, and to <a href=#align-descendants>align descendants</a> to the right.</p>
+
+ <p>The <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and
+ <code><a href=#the-th-element>th</a></code> elements, when they have an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">justify</code>", are expected to full-justify text within
+ themselves, as if they had their 'text-align' property set to
+ 'justify' in a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a>, and to <a href=#align-descendants>align descendants</a> to the left.</p>
+
+ <p>User agents are expected to have a rule in their user agent
+ stylesheet that matches <code><a href=#the-th-element>th</a></code> elements that have a parent
+ node whose computed value for the 'text-align' property is its
+ initial value, whose declaration block consists of just a single
+ declaration that sets the 'text-align' property to the value
+ 'center'.</p> <!-- q.v. '-moz-center-or-inherit' -->
+
+ <hr><p>When a <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>,
+ <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
+ <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> element has a <code title=attr-background><a href=#attr-background>background</a></code> attribute set to a
+ non-empty value, the new value is expected to be <a href=#resolve-a-url title="resolve a url">resolved</a> relative to the element, and
+ if this is successful, the user agent is expected to treat the
+ attribute as a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a> setting the element's 'background-image' property to the
+ resulting <a href=#absolute-url>absolute URL</a>.</p>
+
+ <p>When a <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>,
+ <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
+ <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> element has a <code title="">bgcolor</code> attribute set, the new value is expected to
+ be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
+ value</a>, and if that does not return an error, the user agent
+ is expected to treat the attribute as a <a href=#presentational-hints title="presentational
+ hints">presentational hint</a> setting the element's
+ 'background-color' property to the resulting color.</p>
+
+ <p>When a <code><a href=#the-table-element>table</a></code> element has a <code title=attr-table-bordercolor>bordercolor</code> attribute, its
+ value is expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a
+ legacy color value</a>, and if that does not return an error, the
+ user agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
+ element's 'border-top-color', 'border-right-color',
+ 'border-bottom-color', and 'border-right-color' properties to the
+ resulting color.</p>
+
+ <hr><p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-border><a href=#attr-table-border>border</a></code> attribute <a href=#maps-to-the-pixel-length-property title="maps
to the pixel length property">maps to the pixel length
properties</a> 'border-top-width', 'border-right-width',
'border-bottom-width', 'border-left-width' on the element. If the
@@ -92603,53 +92668,33 @@
<a href=#table-model>table model</a> as the <code><a href=#the-table-element>table</a></code> element to
zero.</p>
- <p>The <code><a href=#the-wbr-element>wbr</a></code> element is expected to override the
- 'white-space' property and always provide a line-breaking
- opportunity.</p>
- </div>
+ <h4 id=form-controls><span class=secno>15.3.9 </span>Form controls</h4>
- <div class=impl>
-
- <h4 id=resetting-rules-for-inherited-properties><span class=secno>15.2.7 </span>Resetting rules for inherited properties</h4>
-
- <p>The following rules are also expected to be in play, resetting
- certain properties to block inheritance by default.</p>
-
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-table, input, select, option, optgroup, button, textarea, keygen {
+input, select, option, optgroup, button, textarea, keygen {
text-indent: initial;
-}</pre>
+}
- <!-- arguably, the form controls' 'text-indent' lines should be in
- the sections below instead of here, but that would be far more
- complicated than this -->
+textarea { white-space: pre-wrap; }
+</pre>
<p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
expected to apply:</p>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-table {
- font-weight: initial;
- font-style: initial;
- font-variant: initial;
- font-size: initial;
- line-height: initial;
- white-space: initial;
- text-align: initial;
-}
-
input { box-sizing: border-box; }</pre>
- </div>
+ <p>Each kind of form control is also given a specific default
+ binding, as described in subsequent sections, which implements the
+ look and feel of the control.</p>
- <div class=impl>
- <h4 id=the-hr-element-0><span class=secno>15.2.8 </span>The <code><a href=#the-hr-element>hr</a></code> element</h4>
+ <h4 id=the-hr-element-0><span class=secno>15.3.10 </span>The <code><a href=#the-hr-element>hr</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -92697,13 +92742,10 @@
hints">presentational hint</a> setting the element's 'color'
property to the resulting color.</p>
- </div>
- <div class=impl>
+ <h4 id=the-fieldset-element-0><span class=secno>15.3.11 </span>The <code><a href=#the-fieldset-element>fieldset</a></code> element</h4>
- <h4 id=the-fieldset-element-0><span class=secno>15.2.9 </span>The <code><a href=#the-fieldset-element>fieldset</a></code> element</h4>
-
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
fieldset {
@@ -92749,15 +92791,10 @@
<td>On the right
<tr><td><code title="">center</code>
<td>In the middle
- </table></div>
+ </table><h3 id=replaced-elements><span class=secno>15.4 </span>Replaced elements</h3>
+ <h4 id=embedded-content-2><span class=secno>15.4.1 </span>Embedded content</h4>
- <div class=impl>
-
- <h3 id=replaced-elements><span class=secno>15.3 </span>Replaced elements</h3>
-
- <h4 id=embedded-content-2><span class=secno>15.3.1 </span>Embedded content</h4>
-
<p>The <code><a href=#the-embed-element>embed</a></code>, <code><a href=#the-iframe-element>iframe</a></code>, and
<code><a href=#the-video-element>video</a></code> elements are expected to be treated as replaced
elements.</p>
@@ -92829,14 +92866,14 @@
<div class=impl>
- <h4 id=timed-text-tracks-0><span class=secno>15.3.2 </span>Timed text tracks</h4>
+ <h4 id=timed-text-tracks-0><span class=secno>15.4.2 </span>Timed text tracks</h4>
<p class=note>This section is intended to be moved to its own CSS
module once an editor is found to run with it.</p>
- <h5 id=webvtt-cue-text-rendering-rules><span class=secno>15.3.2.1 </span><dfn>WebVTT cue text rendering rules</dfn></h5>
+ <h5 id=webvtt-cue-text-rendering-rules><span class=secno>15.4.2.1 </span><dfn>WebVTT cue text rendering rules</dfn></h5>
<p>The <dfn id=rules-for-updating-the-display-of-webvtt-text-tracks>rules for updating the display of WebVTT text
tracks</dfn> render the <a href=#text-track title="text track">text
@@ -93392,7 +93429,7 @@
entirely.</p>
- <h5 id=applying-css-properties-to-webvtt-node-objects><span class=secno>15.3.2.2 </span>Applying CSS properties to <a href=#webvtt-node-object title="WebVTT Node Object">WebVTT Node Objects</a></h5>
+ <h5 id=applying-css-properties-to-webvtt-node-objects><span class=secno>15.4.2.2 </span>Applying CSS properties to <a href=#webvtt-node-object title="WebVTT Node Object">WebVTT Node Objects</a></h5>
<p>When following the <a href=#rules-for-updating-the-display-of-webvtt-text-tracks>rules for updating the display of WebVTT
text tracks</a>, user agents must set properties of <a href=#webvtt-node-object title="WebVTT Node Object">WebVTT Node Objects</a> as defined in
@@ -93455,7 +93492,7 @@
values.</p>
- <h5 id=css-extensions><span class=secno>15.3.2.3 </span>CSS extensions</h5>
+ <h5 id=css-extensions><span class=secno>15.4.2.3 </span>CSS extensions</h5>
<p>When a user agent is rendering one or more <a href=#text-track-cue title="text
track cue">text track cues</a> according to the <a href=#webvtt-cue-text-rendering-rules>WebVTT cue
@@ -93487,7 +93524,7 @@
':past' and ':future' pseudo-classes.</p>
- <h6 id="the-'::cue'-pseudo-element"><span class=secno>15.3.2.3.1 </span>The '::cue' pseudo-element</h6>
+ <h6 id="the-'::cue'-pseudo-element"><span class=secno>15.4.2.3.1 </span>The '::cue' pseudo-element</h6>
<p>The '<dfn id=pseudo-cue title=pseudo-cue>::cue</dfn>' pseudo-element (with no
argument) matches any <a href=#list-of-webvtt-node-objects>List of WebVTT Node Objects</a>
@@ -93629,7 +93666,7 @@
the <a href=#webvtt-cue-background-box>WebVTT cue background box</a>.</p>
- <h6 id="the-':past'-and-':future'-pseudo-classes"><span class=secno>15.3.2.3.2 </span>The ':past' and ':future' pseudo-classes</h6>
+ <h6 id="the-':past'-and-':future'-pseudo-classes"><span class=secno>15.4.2.3.2 </span>The ':past' and ':future' pseudo-classes</h6>
<p>The <dfn id=past-pseudo-class title=past-pseudo-class>':past'</dfn> and <dfn id=future-pseudo-class title=future-pseudo-class>':future'</dfn> pseudo-classes only
match <a href=#webvtt-node-object title="WebVTT Node Object">WebVTT Node Objects</a>.</p>
@@ -93667,7 +93704,7 @@
<div class=impl>
- <h4 id=images-0><span class=secno>15.3.3 </span>Images</h4>
+ <h4 id=images-0><span class=secno>15.4.3 </span>Images</h4>
<p>When an <code><a href=#the-img-element>img</a></code> element or an <code><a href=#the-input-element>input</a></code> element
when its <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in
@@ -93749,7 +93786,7 @@
<div class=impl>
- <h4 id=attributes-for-embedded-content-and-images><span class=secno>15.3.4 </span>Attributes for embedded content and images</h4>
+ <h4 id=attributes-for-embedded-content-and-images><span class=secno>15.4.4 </span>Attributes for embedded content and images</h4>
<p>The following CSS rules are expected to apply as
<a href=#presentational-hints>presentational hints</a>:</p>
@@ -93845,7 +93882,7 @@
<div class=impl>
- <h4 id=image-maps-0><span class=secno>15.3.5 </span>Image maps</h4>
+ <h4 id=image-maps-0><span class=secno>15.4.5 </span>Image maps</h4>
<p>Shapes on an <a href=#image-map>image map</a> are expected to act, for the
purpose of the CSS cascade, as elements independent of the original
@@ -93873,7 +93910,7 @@
<div class=impl>
- <h4 id=toolbars-0><span class=secno>15.3.6 </span>Toolbars</h4>
+ <h4 id=toolbars-0><span class=secno>15.4.6 </span>Toolbars</h4>
<p>When a <code><a href=#the-menu-element>menu</a></code> element's <code title=attr-menu-type><a href=#attr-menu-type>type</a></code> attribute is in the <a href=#toolbar-state title="toolbar state">toolbar</a> state, the element is
expected to be treated as a replaced element with a height about two
@@ -93889,9 +93926,9 @@
<div class=impl>
- <h3 id=bindings><span class=secno>15.4 </span>Bindings</h3>
+ <h3 id=bindings><span class=secno>15.5 </span>Bindings</h3>
- <h4 id=introduction-18><span class=secno>15.4.1 </span>Introduction</h4>
+ <h4 id=introduction-17><span class=secno>15.5.1 </span>Introduction</h4>
<p>A number of elements have their rendering defined in terms of the
'binding' property. <a href=#refsBECSS>[BECSS]</a></p>
@@ -93914,7 +93951,7 @@
<div class=impl>
- <h4 id=the-button-element-0><span class=secno>15.4.2 </span>The <code><a href=#the-button-element>button</a></code> element</h4>
+ <h4 id=the-button-element-0><span class=secno>15.5.2 </span>The <code><a href=#the-button-element>button</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -93930,7 +93967,7 @@
<div class=impl>
- <h4 id=the-details-element-0><span class=secno>15.4.3 </span>The <code><a href=#the-details-element>details</a></code> element</h4>
+ <h4 id=the-details-element-0><span class=secno>15.5.3 </span>The <code><a href=#the-details-element>details</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -93965,7 +94002,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-text-entry-widget><span class=secno>15.4.4 </span>The <code><a href=#the-input-element>input</a></code> element as a text entry widget</h4>
+ <h4 id=the-input-element-as-a-text-entry-widget><span class=secno>15.5.4 </span>The <code><a href=#the-input-element>input</a></code> element as a text entry widget</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94012,7 +94049,7 @@
<div class=impl>
- <h4 id=the-input-element-as-domain-specific-widgets><span class=secno>15.4.5 </span>The <code><a href=#the-input-element>input</a></code> element as domain-specific widgets</h4>
+ <h4 id=the-input-element-as-domain-specific-widgets><span class=secno>15.5.5 </span>The <code><a href=#the-input-element>input</a></code> element as domain-specific widgets</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94067,7 +94104,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-range-control><span class=secno>15.4.6 </span>The <code><a href=#the-input-element>input</a></code> element as a range control</h4>
+ <h4 id=the-input-element-as-a-range-control><span class=secno>15.5.6 </span>The <code><a href=#the-input-element>input</a></code> element as a range control</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94093,7 +94130,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-color-well><span class=secno>15.4.7 </span>The <code><a href=#the-input-element>input</a></code> element as a color well</h4>
+ <h4 id=the-input-element-as-a-color-well><span class=secno>15.5.7 </span>The <code><a href=#the-input-element>input</a></code> element as a color well</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94115,7 +94152,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-checkbox-and-radio-button-widgets><span class=secno>15.4.8 </span>The <code><a href=#the-input-element>input</a></code> element as a checkbox and radio button widgets</h4>
+ <h4 id=the-input-element-as-a-checkbox-and-radio-button-widgets><span class=secno>15.5.8 </span>The <code><a href=#the-input-element>input</a></code> element as a checkbox and radio button widgets</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94137,7 +94174,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-file-upload-control><span class=secno>15.4.9 </span>The <code><a href=#the-input-element>input</a></code> element as a file upload control</h4>
+ <h4 id=the-input-element-as-a-file-upload-control><span class=secno>15.5.9 </span>The <code><a href=#the-input-element>input</a></code> element as a file upload control</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94155,7 +94192,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-button><span class=secno>15.4.10 </span>The <code><a href=#the-input-element>input</a></code> element as a button</h4>
+ <h4 id=the-input-element-as-a-button><span class=secno>15.5.10 </span>The <code><a href=#the-input-element>input</a></code> element as a button</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94176,7 +94213,7 @@
<div class=impl>
- <h4 id=the-marquee-element-0><span class=secno>15.4.11 </span>The <code><a href=#the-marquee-element>marquee</a></code> element</h4>
+ <h4 id=the-marquee-element-0><span class=secno>15.5.11 </span>The <code><a href=#the-marquee-element>marquee</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94340,7 +94377,7 @@
<div class=impl>
- <h4 id=the-meter-element-0><span class=secno>15.4.12 </span>The <code><a href=#the-meter-element>meter</a></code> element</h4>
+ <h4 id=the-meter-element-0><span class=secno>15.5.12 </span>The <code><a href=#the-meter-element>meter</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94371,7 +94408,7 @@
<div class=impl>
- <h4 id=the-progress-element-0><span class=secno>15.4.13 </span>The <code><a href=#the-progress-element>progress</a></code> element</h4>
+ <h4 id=the-progress-element-0><span class=secno>15.5.13 </span>The <code><a href=#the-progress-element>progress</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94417,7 +94454,7 @@
<div class=impl>
- <h4 id=the-select-element-0><span class=secno>15.4.14 </span>The <code><a href=#the-select-element>select</a></code> element</h4>
+ <h4 id=the-select-element-0><span class=secno>15.5.14 </span>The <code><a href=#the-select-element>select</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94485,7 +94522,7 @@
<div class=impl>
- <h4 id=the-textarea-element-0><span class=secno>15.4.15 </span>The <code><a href=#the-textarea-element>textarea</a></code> element</h4>
+ <h4 id=the-textarea-element-0><span class=secno>15.5.15 </span>The <code><a href=#the-textarea-element>textarea</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94540,7 +94577,7 @@
<div class=impl>
- <h4 id=the-keygen-element-0><span class=secno>15.4.16 </span>The <code><a href=#the-keygen-element>keygen</a></code> element</h4>
+ <h4 id=the-keygen-element-0><span class=secno>15.5.16 </span>The <code><a href=#the-keygen-element>keygen</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94556,7 +94593,7 @@
<div class=impl>
- <h4 id=the-time-element-0><span class=secno>15.4.17 </span>The <code><a href=#the-time-element>time</a></code> element</h4>
+ <h4 id=the-time-element-0><span class=secno>15.5.17 </span>The <code><a href=#the-time-element>time</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -94576,7 +94613,7 @@
<div class=impl>
- <h3 id=frames-and-framesets><span class=secno>15.5 </span>Frames and framesets</h3>
+ <h3 id=frames-and-framesets><span class=secno>15.6 </span>Frames and framesets</h3>
<p>When an <code><a href=#the-html-element>html</a></code> element's second child element is a
<code><a href=#frameset>frameset</a></code> element, the user agent is expected to render
@@ -94861,9 +94898,9 @@
<div class=impl>
- <h3 id=interactive-media><span class=secno>15.6 </span>Interactive media</h3>
+ <h3 id=interactive-media><span class=secno>15.7 </span>Interactive media</h3>
- <h4 id=links,-forms,-and-navigation><span class=secno>15.6.1 </span>Links, forms, and navigation</h4>
+ <h4 id=links,-forms,-and-navigation><span class=secno>15.7.1 </span>Links, forms, and navigation</h4>
<p>User agents are expected to allow the user to control aspects of
<a href=#hyperlink>hyperlink</a> activation and <a href=#form-submission>form submission</a>,
@@ -94899,7 +94936,7 @@
- <h4 id=the-title-attribute-0><span class=secno>15.6.2 </span>The <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute</h4>
+ <h4 id=the-title-attribute-0><span class=secno>15.7.2 </span>The <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute</h4>
<p>Given an element (e.g. the element designated by the mouse
cursor), if the element, or one of its ancestors, has a <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute, and the nearest such
@@ -94937,7 +94974,7 @@
</div>
- <h4 id=editing-hosts><span class=secno>15.6.3 </span>Editing hosts</h4>
+ <h4 id=editing-hosts><span class=secno>15.7.3 </span>Editing hosts</h4>
<p>The current text editing caret (the one at the <a href=#caret-position>caret
position</a> in a focused <a href=#editing-host>editing host</a>) is expected
@@ -94951,7 +94988,7 @@
- <h4 id=text-rendered-in-native-user-interfaces><span class=secno>15.6.4 </span>Text rendered in native user interfaces</h4>
+ <h4 id=text-rendered-in-native-user-interfaces><span class=secno>15.7.4 </span>Text rendered in native user interfaces</h4>
<p>User agents are expected to honor the Unicode semantics of text
that is exposed in user interfaces, for example supporting the
@@ -95047,7 +95084,7 @@
- <h3 id=print-media><span class=secno>15.7 </span>Print media</h3>
+ <h3 id=print-media><span class=secno>15.8 </span>Print media</h3>
<p>User agents are expected to allow the user to request the
opportunity to <dfn id=obtain-a-physical-form>obtain a physical form</dfn> (or a
Modified: index
===================================================================
--- index 2011-06-30 23:52:43 UTC (rev 6275)
+++ index 2011-07-02 00:12:59 UTC (rev 6276)
@@ -243,7 +243,7 @@
<header class=head id=head><p><a class=logo href=http://www.whatwg.org/><img alt=WHATWG height=101 src=/images/logo width=101></a></p>
<hgroup><h1 class=allcaps>HTML</h1>
- <h2 class="no-num no-toc">Living Standard — Last Updated 30 June 2011</h2>
+ <h2 class="no-num no-toc">Living Standard — Last Updated 1 July 2011</h2>
</hgroup><dl><dt><strong>Web developer edition</strong></dt>
<dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
<dt>Multiple-page version:</dt>
@@ -1196,59 +1196,62 @@
<li><a href=#rendering><span class=secno>13 </span>Rendering</a>
<ol>
<li><a href=#introduction-14><span class=secno>13.1 </span>Introduction</a></li>
- <li><a href=#the-css-user-agent-style-sheet-and-presentational-hints><span class=secno>13.2 </span>The CSS user agent style sheet and presentational hints</a>
+ <li><a href=#the-css-user-agent-style-sheet-and-presentational-hints><span class=secno>13.2 </span>The CSS user agent style sheet and presentational hints</a></li>
+ <li><a href=#non-replaced-elements><span class=secno>13.3 </span>Non-replaced elements</a>
<ol>
- <li><a href=#introduction-15><span class=secno>13.2.1 </span>Introduction</a></li>
- <li><a href=#display-types><span class=secno>13.2.2 </span>Display types</a></li>
- <li><a href=#margins-and-padding><span class=secno>13.2.3 </span>Margins and padding</a></li>
- <li><a href=#alignment><span class=secno>13.2.4 </span>Alignment</a></li>
- <li><a href=#fonts-and-colors><span class=secno>13.2.5 </span>Fonts and colors</a></li>
- <li><a href=#punctuation-and-decorations><span class=secno>13.2.6 </span>Punctuation and decorations</a></li>
- <li><a href=#resetting-rules-for-inherited-properties><span class=secno>13.2.7 </span>Resetting rules for inherited properties</a></li>
- <li><a href=#the-hr-element-0><span class=secno>13.2.8 </span>The <code>hr</code> element</a></li>
- <li><a href=#the-fieldset-element-0><span class=secno>13.2.9 </span>The <code>fieldset</code> element</a></ol></li>
- <li><a href=#replaced-elements><span class=secno>13.3 </span>Replaced elements</a>
+ <li><a href=#hidden-elements><span class=secno>13.3.1 </span>Hidden elements</a></li>
+ <li><a href=#the-page><span class=secno>13.3.2 </span>The page</a></li>
+ <li><a href=#flow-content-1><span class=secno>13.3.3 </span>Flow content</a></li>
+ <li><a href=#phrasing-content-1><span class=secno>13.3.4 </span>Phrasing content</a></li>
+ <li><a href=#bidirectional-text><span class=secno>13.3.5 </span>Bidirectional text</a></li>
+ <li><a href=#sections-and-headings><span class=secno>13.3.6 </span>Sections and headings</a></li>
+ <li><a href=#lists><span class=secno>13.3.7 </span>Lists</a></li>
+ <li><a href=#tables><span class=secno>13.3.8 </span>Tables</a></li>
+ <li><a href=#form-controls><span class=secno>13.3.9 </span>Form controls</a></li>
+ <li><a href=#the-hr-element-0><span class=secno>13.3.10 </span>The <code>hr</code> element</a></li>
+ <li><a href=#the-fieldset-element-0><span class=secno>13.3.11 </span>The <code>fieldset</code> element</a></ol></li>
+ <li><a href=#replaced-elements><span class=secno>13.4 </span>Replaced elements</a>
<ol>
- <li><a href=#embedded-content-2><span class=secno>13.3.1 </span>Embedded content</a></li>
- <li><a href=#timed-text-tracks-0><span class=secno>13.3.2 </span>Timed text tracks</a>
+ <li><a href=#embedded-content-2><span class=secno>13.4.1 </span>Embedded content</a></li>
+ <li><a href=#timed-text-tracks-0><span class=secno>13.4.2 </span>Timed text tracks</a>
<ol>
- <li><a href=#webvtt-cue-text-rendering-rules><span class=secno>13.3.2.1 </span>WebVTT cue text rendering rules</a></li>
- <li><a href=#applying-css-properties-to-webvtt-node-objects><span class=secno>13.3.2.2 </span>Applying CSS properties to WebVTT Node Objects</a></li>
- <li><a href=#css-extensions><span class=secno>13.3.2.3 </span>CSS extensions</a>
+ <li><a href=#webvtt-cue-text-rendering-rules><span class=secno>13.4.2.1 </span>WebVTT cue text rendering rules</a></li>
+ <li><a href=#applying-css-properties-to-webvtt-node-objects><span class=secno>13.4.2.2 </span>Applying CSS properties to WebVTT Node Objects</a></li>
+ <li><a href=#css-extensions><span class=secno>13.4.2.3 </span>CSS extensions</a>
<ol>
- <li><a href="#the-'::cue'-pseudo-element"><span class=secno>13.3.2.3.1 </span>The '::cue' pseudo-element</a></li>
- <li><a href="#the-':past'-and-':future'-pseudo-classes"><span class=secno>13.3.2.3.2 </span>The ':past' and ':future' pseudo-classes</a></ol></ol></li>
- <li><a href=#images-0><span class=secno>13.3.3 </span>Images</a></li>
- <li><a href=#attributes-for-embedded-content-and-images><span class=secno>13.3.4 </span>Attributes for embedded content and images</a></li>
- <li><a href=#image-maps-0><span class=secno>13.3.5 </span>Image maps</a></li>
- <li><a href=#toolbars-0><span class=secno>13.3.6 </span>Toolbars</a></ol></li>
- <li><a href=#bindings><span class=secno>13.4 </span>Bindings</a>
+ <li><a href="#the-'::cue'-pseudo-element"><span class=secno>13.4.2.3.1 </span>The '::cue' pseudo-element</a></li>
+ <li><a href="#the-':past'-and-':future'-pseudo-classes"><span class=secno>13.4.2.3.2 </span>The ':past' and ':future' pseudo-classes</a></ol></ol></li>
+ <li><a href=#images-0><span class=secno>13.4.3 </span>Images</a></li>
+ <li><a href=#attributes-for-embedded-content-and-images><span class=secno>13.4.4 </span>Attributes for embedded content and images</a></li>
+ <li><a href=#image-maps-0><span class=secno>13.4.5 </span>Image maps</a></li>
+ <li><a href=#toolbars-0><span class=secno>13.4.6 </span>Toolbars</a></ol></li>
+ <li><a href=#bindings><span class=secno>13.5 </span>Bindings</a>
<ol>
- <li><a href=#introduction-16><span class=secno>13.4.1 </span>Introduction</a></li>
- <li><a href=#the-button-element-0><span class=secno>13.4.2 </span>The <code>button</code> element</a></li>
- <li><a href=#the-details-element-0><span class=secno>13.4.3 </span>The <code>details</code> element</a></li>
- <li><a href=#the-input-element-as-a-text-entry-widget><span class=secno>13.4.4 </span>The <code>input</code> element as a text entry widget</a></li>
- <li><a href=#the-input-element-as-domain-specific-widgets><span class=secno>13.4.5 </span>The <code>input</code> element as domain-specific widgets</a></li>
- <li><a href=#the-input-element-as-a-range-control><span class=secno>13.4.6 </span>The <code>input</code> element as a range control</a></li>
- <li><a href=#the-input-element-as-a-color-well><span class=secno>13.4.7 </span>The <code>input</code> element as a color well</a></li>
- <li><a href=#the-input-element-as-a-checkbox-and-radio-button-widgets><span class=secno>13.4.8 </span>The <code>input</code> element as a checkbox and radio button widgets</a></li>
- <li><a href=#the-input-element-as-a-file-upload-control><span class=secno>13.4.9 </span>The <code>input</code> element as a file upload control</a></li>
- <li><a href=#the-input-element-as-a-button><span class=secno>13.4.10 </span>The <code>input</code> element as a button</a></li>
- <li><a href=#the-marquee-element-0><span class=secno>13.4.11 </span>The <code>marquee</code> element</a></li>
- <li><a href=#the-meter-element-0><span class=secno>13.4.12 </span>The <code>meter</code> element</a></li>
- <li><a href=#the-progress-element-0><span class=secno>13.4.13 </span>The <code>progress</code> element</a></li>
- <li><a href=#the-select-element-0><span class=secno>13.4.14 </span>The <code>select</code> element</a></li>
- <li><a href=#the-textarea-element-0><span class=secno>13.4.15 </span>The <code>textarea</code> element</a></li>
- <li><a href=#the-keygen-element-0><span class=secno>13.4.16 </span>The <code>keygen</code> element</a></li>
- <li><a href=#the-time-element-0><span class=secno>13.4.17 </span>The <code>time</code> element</a></ol></li>
- <li><a href=#frames-and-framesets><span class=secno>13.5 </span>Frames and framesets</a></li>
- <li><a href=#interactive-media><span class=secno>13.6 </span>Interactive media</a>
+ <li><a href=#introduction-15><span class=secno>13.5.1 </span>Introduction</a></li>
+ <li><a href=#the-button-element-0><span class=secno>13.5.2 </span>The <code>button</code> element</a></li>
+ <li><a href=#the-details-element-0><span class=secno>13.5.3 </span>The <code>details</code> element</a></li>
+ <li><a href=#the-input-element-as-a-text-entry-widget><span class=secno>13.5.4 </span>The <code>input</code> element as a text entry widget</a></li>
+ <li><a href=#the-input-element-as-domain-specific-widgets><span class=secno>13.5.5 </span>The <code>input</code> element as domain-specific widgets</a></li>
+ <li><a href=#the-input-element-as-a-range-control><span class=secno>13.5.6 </span>The <code>input</code> element as a range control</a></li>
+ <li><a href=#the-input-element-as-a-color-well><span class=secno>13.5.7 </span>The <code>input</code> element as a color well</a></li>
+ <li><a href=#the-input-element-as-a-checkbox-and-radio-button-widgets><span class=secno>13.5.8 </span>The <code>input</code> element as a checkbox and radio button widgets</a></li>
+ <li><a href=#the-input-element-as-a-file-upload-control><span class=secno>13.5.9 </span>The <code>input</code> element as a file upload control</a></li>
+ <li><a href=#the-input-element-as-a-button><span class=secno>13.5.10 </span>The <code>input</code> element as a button</a></li>
+ <li><a href=#the-marquee-element-0><span class=secno>13.5.11 </span>The <code>marquee</code> element</a></li>
+ <li><a href=#the-meter-element-0><span class=secno>13.5.12 </span>The <code>meter</code> element</a></li>
+ <li><a href=#the-progress-element-0><span class=secno>13.5.13 </span>The <code>progress</code> element</a></li>
+ <li><a href=#the-select-element-0><span class=secno>13.5.14 </span>The <code>select</code> element</a></li>
+ <li><a href=#the-textarea-element-0><span class=secno>13.5.15 </span>The <code>textarea</code> element</a></li>
+ <li><a href=#the-keygen-element-0><span class=secno>13.5.16 </span>The <code>keygen</code> element</a></li>
+ <li><a href=#the-time-element-0><span class=secno>13.5.17 </span>The <code>time</code> element</a></ol></li>
+ <li><a href=#frames-and-framesets><span class=secno>13.6 </span>Frames and framesets</a></li>
+ <li><a href=#interactive-media><span class=secno>13.7 </span>Interactive media</a>
<ol>
- <li><a href=#links,-forms,-and-navigation><span class=secno>13.6.1 </span>Links, forms, and navigation</a></li>
- <li><a href=#the-title-attribute-0><span class=secno>13.6.2 </span>The <code title=attr-title>title</code> attribute</a></li>
- <li><a href=#editing-hosts><span class=secno>13.6.3 </span>Editing hosts</a></li>
- <li><a href=#text-rendered-in-native-user-interfaces><span class=secno>13.6.4 </span>Text rendered in native user interfaces</a></ol></li>
- <li><a href=#print-media><span class=secno>13.7 </span>Print media</a></ol></li>
+ <li><a href=#links,-forms,-and-navigation><span class=secno>13.7.1 </span>Links, forms, and navigation</a></li>
+ <li><a href=#the-title-attribute-0><span class=secno>13.7.2 </span>The <code title=attr-title>title</code> attribute</a></li>
+ <li><a href=#editing-hosts><span class=secno>13.7.3 </span>Editing hosts</a></li>
+ <li><a href=#text-rendered-in-native-user-interfaces><span class=secno>13.7.4 </span>Text rendered in native user interfaces</a></ol></li>
+ <li><a href=#print-media><span class=secno>13.8 </span>Print media</a></ol></li>
<li><a href=#obsolete><span class=secno>14 </span>Obsolete features</a>
<ol>
<li><a href=#obsolete-but-conforming-features><span class=secno>14.1 </span>Obsolete but conforming features</a>
@@ -87313,15 +87316,10 @@
element is not <a href=#being-rendered>being rendered</a>, though this might be
overridden by the style sheets.</p>
- </div>
- <div class=impl>
-
<h3 id=the-css-user-agent-style-sheet-and-presentational-hints><span class=secno>13.2 </span>The CSS user agent style sheet and presentational hints</h3>
- <h4 id=introduction-15><span class=secno>13.2.1 </span>Introduction</h4>
-
<p>The CSS rules given in these subsections are, except where
otherwise specified, expected to be used as part of the user-agent
level style sheet defaults for all documents that contain <a href=#html-elements>HTML
@@ -87367,136 +87365,43 @@
the dimension was an integer, and with the value given as a
percentage if the dimension was a percentage.</p>
- </div>
+ <p>When a user agent is to <dfn id=align-descendants>align descendants</dfn> of a node,
+ the user agent is expected to align only those descendants that have
+ both their 'margin-left' and 'margin-right' properties computing to
+ a value other than 'auto', that are over-constrained and that have
+ one of those two margins with a used value forced to a greater
+ value, and that do not themselves have an applicable <code title=attr-align>align</code> attribute. When multiple elements
+ are to <a href=#align-descendants title="align descendants">align</a> a particular
+ descendant, the most deeply nested such element is expected to
+ override the others.</p>
- <div class=impl>
- <h4 id=display-types><span class=secno>13.2.2 </span>Display types</h4>
+ <h3 id=non-replaced-elements><span class=secno>13.3 </span>Non-replaced elements</h3>
+
+ <h4 id=hidden-elements><span class=secno>13.3.1 </span>Hidden elements</h4>
+
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
[hidden], area, base, basefont, command, datalist, head,
input[type=hidden], link, menu[type=context], meta, noembed, noframes,
param, rp, script, source, style, track, title { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
display: none;
-}
+}</pre>
-address, article, aside, blockquote, body, center, dd, dir, div, dl,
-dt, figure, figcaption, footer, form, h1, h2, h3, h4, h5, h6, header,
-hgroup, hr, html, legend, listing, menu, nav, ol, p, plaintext, pre,
-section, summary, ul, xmp { display: block; unicode-bidi: isolate; }
-
-table { display: table; unicode-bidi: isolate; }
-caption { display: table-caption; unicode-bidi: isolate; }
-colgroup, colgroup[hidden] { display: table-column-group; unicode-bidi: isolate; }
-col, col[hidden] { display: table-column; unicode-bidi: isolate; }
-thead, thead[hidden] { display: table-header-group; unicode-bidi: isolate; }
-tbody, tbody[hidden] { display: table-row-group; unicode-bidi: isolate; }
-tfoot, tfoot[hidden] { display: table-footer-group; unicode-bidi: isolate; }
-tr, tr[hidden] { display: table-row; unicode-bidi: isolate; }
-td, th, td[hidden], th[hidden] { display: table-cell; unicode-bidi: isolate; }
-
-colgroup[hidden], col[hidden], thead[hidden], tbody[hidden],
-tfoot[hidden], tr[hidden], td[hidden], th[hidden] {
- visibility: collapse;
-}
-
-li { display: list-item; unicode-bidi: isolate; }
-
-ruby { display: ruby; }
-rt { display: ruby-text; }</pre>
-
- <!-- del, ins, and map are inline. -->
-
- <p>For the purposes of the CSS table model, the <code><a href=#the-col-element>col</a></code>
- element is expected to be treated as if it was present as many times
- as its <code title=attr-col-span><a href=#attr-col-span>span</a></code> attribute <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative
- integers">specifies</a>.</p>
-
- <p>For the purposes of the CSS table model, the
- <code><a href=#the-colgroup-element>colgroup</a></code> element, if it contains no <code><a href=#the-col-element>col</a></code>
- element, is expected to be treated as if it had as many such
- children as its <code title=attr-colgroup-span><a href=#attr-colgroup-span>span</a></code>
- attribute <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative
- integers">specifies</a>.</p>
-
- <p>For the purposes of the CSS table model, the <code title=attr-tdth-colspan><a href=#attr-tdth-colspan>colspan</a></code> and <code title=attr-tdth-rowspan><a href=#attr-tdth-rowspan>rowspan</a></code> attributes on
- <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements are expected to <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative integers">provide</a> the
- <i>special knowledge</i> regarding cells spanning rows and
- columns.</p>
-
- <p>For the purposes of the CSS ruby model, runs of children of
- <code><a href=#the-ruby-element>ruby</a></code> elements that are not <code><a href=#the-rt-element>rt</a></code> or
- <code><a href=#the-rp-element>rp</a></code> elements are expected to be wrapped in anonymous
- boxes whose 'display' property has the value 'ruby-base'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
-
- <p>User agents that do not support correct ruby rendering are
- expected to render parentheses around the text of <code><a href=#the-rt-element>rt</a></code>
- elements in the absence of <code><a href=#the-rp-element>rp</a></code> elements.</p>
-
<p>The user agent is expected to hide <code><a href=#the-noscript-element>noscript</a></code> elements
for whom <a href=#concept-n-script title=concept-n-script>scripting is enabled</a>,
irrespective of CSS rules.</p>
- <p>In <a href=#html-documents>HTML documents</a>, the user agent is expected to
- hide <code><a href=#the-form-element>form</a></code> elements that are children of
- <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
- <code><a href=#the-tfoot-element>tfoot</a></code>, or <code><a href=#the-tr-element>tr</a></code> elements, irrespective of CSS
- rules.</p>
- </div>
+ <h4 id=the-page><span class=secno>13.3.2 </span>The page</h4>
-
- <div class=impl>
-
- <h4 id=margins-and-padding><span class=secno>13.2.3 </span>Margins and padding</h4>
-
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-blockquote, dir, dl, figure, listing, menu, ol, p, plaintext,
-pre, ul, xmp {
- margin-top: 1em; margin-bottom: 1em;
-}
+html, body { display: block; }</pre>
-dir dir, dir dl, dir menu, dir ol, dir ul,
-dl dir, dl dl, dl menu, dl ol, dl ul,
-menu dir, menu dl, menu menu, menu ol, menu ul,
-ol dir, ol dl, ol menu, ol ol, ol ul,
-ul dir, ul dl, ul menu, ul ol, ul ul {
- margin-top: 0; margin-bottom: 0;
-}
-
-h1 { margin-top: 0.67em; margin-bottom: 0.67em; }
-h2 { margin-top: 0.83em; margin-bottom: 0.83em; }
-h3 { margin-top: 1.00em; margin-bottom: 1.00em; }
-h4 { margin-top: 1.33em; margin-bottom: 1.33em; }
-h5 { margin-top: 1.67em; margin-bottom: 1.67em; }
-h6 { margin-top: 2.33em; margin-bottom: 2.33em; }
-
-dd { margin-left: 40px; } /* <a href=#ltr-specific>LTR-specific</a>: use 'margin-right' for rtl elements */
-dir, menu, ol, ul { padding-left: 40px; } /* <a href=#ltr-specific>LTR-specific</a>: use 'padding-right' for rtl elements */
-blockquote, figure { margin-left: 40px; margin-right: 40px; }
-
-table { border-spacing: 2px; border-collapse: separate; }
-td, th { padding: 1px; }</pre>
-
- <p>The <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>,
- and <code><a href=#the-section-element>section</a></code> elements are expected to affect the margins
- of <code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h1</a></code> elements, based on the nesting depth. If <var title="">x</var> is a selector that matches elements that are either
- <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>, or
- <code><a href=#the-section-element>section</a></code> elements, then the following rules capture what
- is expected:</p>
-
- <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-
-<var title="">x</var> h1 { margin-top: 0.83em; margin-bottom: 0.83em; }
-<var title="">x</var> <var title="">x</var> h1 { margin-top: 1.00em; margin-bottom: 1.00em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.33em; margin-bottom: 1.33em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.67em; margin-bottom: 1.67em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 2.33em; margin-bottom: 2.33em; }</pre>
-
- <hr><p>For each property in the table below, given a <code><a href=#the-body-element>body</a></code>
+ <p>For each property in the table below, given a <code><a href=#the-body-element>body</a></code>
element, the first attribute that exists <a href=#maps-to-the-pixel-length-property>maps to the pixel
length property</a> on the <code><a href=#the-body-element>body</a></code> element. If none of
the attributes for a property are found, or if the value of the
@@ -87570,131 +87475,95 @@
<td>'hidden'
<tr><td><code title="">auto</code>
<td>'auto'
- </table><hr><p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-cellspacing><a href=#attr-table-cellspacing>cellspacing</a></code> attribute
- <a href=#maps-to-the-pixel-length-property>maps to the pixel length property</a> 'border-spacing' on the
- element.</p>
+ </table><hr><p>When a <code><a href=#document>Document</a></code> is in <a href=#quirks-mode>quirks mode</a>,
+ vertical margins on <a href=#html-elements>HTML elements</a> at the top or bottom
+ of <code><a href=#the-body-element>body</a></code> elements are expected to be collapsed to
+ zero.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-cellpadding><a href=#attr-table-cellpadding>cellpadding</a></code> attribute <a href=#maps-to-the-pixel-length-property title="maps to the pixel length property">maps to the pixel length
- properties</a> 'padding-top', 'padding-right', 'padding-bottom',
- and 'padding-left' of any <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code>
- elements that have corresponding <a href=#concept-cell title=concept-cell>cells</a> in the <a href=#concept-table title=concept-table>table</a> corresponding to the
- <code><a href=#the-table-element>table</a></code> element.</p>
+ <hr><p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-background><a href=#attr-background>background</a></code> attribute set to a
+ non-empty value, the new value is expected to be <a href=#resolve-a-url title="resolve a url">resolved</a> relative to the element, and
+ if this is successful, the user agent is expected to treat the
+ attribute as a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a> setting the element's 'background-image' property to the
+ resulting <a href=#absolute-url>absolute URL</a>.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-hspace>hspace</code> attribute <a href=#maps-to-the-dimension-property title="maps
- to the dimension property">maps to the dimension properties</a>
- 'margin-left' and 'margin-right' on the <code><a href=#the-table-element>table</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title="">bgcolor</code> attribute set, the new value is expected to
+ be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
+ value</a>, and if that does not return an error, the user agent
+ is expected to treat the attribute as a <a href=#presentational-hints title="presentational
+ hints">presentational hint</a> setting the element's
+ 'background-color' property to the resulting color.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-vspace>vspace</code> attribute <a href=#maps-to-the-dimension-property title="maps
- to the dimension property">maps to the dimension properties</a>
- 'margin-top' and 'margin-bottom' on the <code><a href=#the-table-element>table</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-text><a href=#attr-body-text>text</a></code> attribute, its value is expected
+ to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
+ value</a>, and if that does not return an error, the user
+ agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
+ element's 'color' property to the resulting color.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-height>height</code> attribute <a href=#maps-to-the-dimension-property>maps to the
- dimension property</a> 'height' on the <code><a href=#the-table-element>table</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-link><a href=#attr-body-link>link</a></code> attribute, its value is expected
+ to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
+ value</a>, and if that does not return an error, the user agent
+ is expected to treat the attribute as a <a href=#presentational-hints title="presentational
+ hints">presentational hint</a> setting the 'color' property of
+ any element in the <code><a href=#document>Document</a></code> matching the ':link'
+ pseudo-class to the resulting color.</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-width><a href=#attr-table-width>width</a></code> attribute <a href=#maps-to-the-dimension-property>maps to the
- dimension property</a> 'width' on the <code><a href=#the-table-element>table</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-vlink><a href=#attr-body-vlink>vlink</a></code> attribute, its value is
+ expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
+ color value</a>, and if that does not return an error, the user
+ agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
+ 'color' property of any element in the <code><a href=#document>Document</a></code>
+ matching the ':visited' pseudo-class to the resulting color.</p>
- <p>The <code><a href=#the-col-element>col</a></code> element's <code title=attr-col-width><a href=#attr-col-width>width</a></code> attribute <a href=#maps-to-the-dimension-property>maps to the
- dimension property</a> 'width' on the <code><a href=#the-col-element>col</a></code>
- element.</p>
+ <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-alink><a href=#attr-body-alink>alink</a></code> attribute, its value is
+ expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
+ color value</a>, and if that does not return an error, the user
+ agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
+ 'color' property of any element in the <code><a href=#document>Document</a></code>
+ matching the ':active' pseudo-class and either the ':link'
+ pseudo-class or the ':visited' pseudo-class to the resulting
+ color.</p>
- <p>The <code><a href=#the-tr-element>tr</a></code> element's <code title=attr-tr-height>height</code> attribute <a href=#maps-to-the-dimension-property>maps to the
- dimension property</a> 'height' on the <code><a href=#the-tr-element>tr</a></code>
- element.</p>
- <p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-height><a href=#attr-tdth-height>height</a></code> attributes <a href=#maps-to-the-dimension-property title="maps
- to the dimension property">map to the dimension property</a> 'height'
- on the element.</p>
- <p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-width><a href=#attr-tdth-width>width</a></code> attributes <a href=#maps-to-the-dimension-property title="maps
- to the dimension property">map to the dimension property</a> 'width'
- on the element.</p>
+ <h4 id=flow-content-1><span class=secno>13.3.3 </span>Flow content</h4>
- <hr><p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
- expected to apply:</p>
+ <!-- del, ins, and map are inline. -->
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-form { margin-bottom: 1em; }</pre>
+address, blockquote, center, div, figure, figcaption, footer, form,
+header, hr, legend, listing, p, plaintext, pre, summary, xmp {
+ display: block; unicode-bidi: isolate;
+}
- <p>When a <code><a href=#document>Document</a></code> is in <a href=#quirks-mode>quirks mode</a>,
- vertical margins on <a href=#html-elements>HTML elements</a> at the top or bottom
- of <code><a href=#the-body-element>body</a></code>, <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> elements
- are expected to be collapsed to zero.</p>
+blockquote, figure, listing, p, plaintext, pre, xmp {
+ margin-top: 1em; margin-bottom: 1em;
+}
- </div>
+blockquote, figure { margin-left: 40px; margin-right: 40px; }
+address { font-style: italic; }
+listing, plaintext, pre, xmp {
+ font-family: monospace; white-space: pre;
+}</pre>
- <div class=impl>
+ <p>The following rules are also expected to apply, as
+ <a href=#presentational-hints>presentational hints</a>:</p>
- <h4 id=alignment><span class=secno>13.2.4 </span>Alignment</h4>
-
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-thead, tbody, tfoot, table > tr { vertical-align: middle; }
-tr, td, th { vertical-align: inherit; }
-sub { vertical-align: sub; }
-sup { vertical-align: super; }</pre>
+pre[wrap] { white-space: pre-wrap; }</pre>
- <hr><p>The following rules are also expected to apply, as
- <a href=#presentational-hints>presentational hints</a>:</p>
+ <p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
+ expected to apply:</p>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-table[align=left] { float: left; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-table[align=right] { float: right; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-table[align=center], table[align=abscenter],
-table[align=absmiddle], table[align=middle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- margin-left: auto; margin-right: auto;
-}
-thead[align=absmiddle], tbody[align=absmiddle], tfoot[align=absmiddle],
-tr[align=absmiddle], td[align=absmiddle], th[align=absmiddle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: center;
-}
+form { margin-bottom: 1em; }</pre>
-caption[align=bottom] { caption-side: bottom; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-p[align=left], h1[align=left], h2[align=left], h3[align=left],
-h4[align=left], h5[align=left], h6[align=left] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: left;
-}
-p[align=right], h1[align=right], h2[align=right], h3[align=right],
-h4[align=right], h5[align=right], h6[align=right] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: right;
-}
-p[align=center], h1[align=center], h2[align=center], h3[align=center],
-h4[align=center], h5[align=center], h6[align=center] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: center;
-}
-p[align=justify], h1[align=justify], h2[align=justify], h3[align=justify],
-h4[align=justify], h5[align=justify], h6[align=justify] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- text-align: justify;
-}
-thead[valign=top], tbody[valign=top], tfoot[valign=top],
-tr[valign=top], td[valign=top], th[valign=top] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- vertical-align: top;
-}
-thead[valign=middle], tbody[valign=middle], tfoot[valign=middle],
-tr[valign=middle], td[valign=middle], th[valign=middle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- vertical-align: middle;
-}
-thead[valign=bottom], tbody[valign=bottom], tfoot[valign=bottom],
-tr[valign=bottom], td[valign=bottom], th[valign=bottom] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- vertical-align: bottom;
-}
-thead[valign=baseline], tbody[valign=baseline], tfoot[valign=baseline],
-tr[valign=baseline], td[valign=baseline], th[valign=baseline] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- vertical-align: baseline;
-}</pre>
-
- <p>The <code><a href=#center>center</a></code> element, the <code><a href=#the-caption-element>caption</a></code> element
- unless specified otherwise below, and the <code><a href=#the-div-element>div</a></code>,
- <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>,
- <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements when
- they have an <code title=attr-div-align><a href=#attr-div-align>align</a></code> attribute
+ <hr><p>The <code><a href=#center>center</a></code> element, and the <code><a href=#the-div-element>div</a></code> element
+ when it has an <code title=attr-div-align><a href=#attr-div-align>align</a></code> attribute
whose value is an <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for
either the string "<code title="">center</code>" or the string
"<code title="">middle</code>", are expected to center text within
@@ -87703,183 +87572,97 @@
hint</a>, and to <a href=#align-descendants>align descendants</a> to the
center.</p>
- <p>The <code><a href=#the-div-element>div</a></code>, <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements, when they have an
- <code title=attr-align>align</code> attribute whose value is an
- <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">left</code>", are expected to left-align text within
- themselves, as if they had their 'text-align' property set to 'left'
- in a <a href=#presentational-hints title="presentational hints">presentational hint</a>,
- and to <a href=#align-descendants>align descendants</a> to the left.</p>
+ <p>The <code><a href=#the-div-element>div</a></code> element, when it has an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">left</code>", is expected to left-align text within itself,
+ as if it had its 'text-align' property set to 'left' in a <a href=#presentational-hints title="presentational hints">presentational hint</a>, and to
+ <a href=#align-descendants>align descendants</a> to the left.</p>
- <p>The <code><a href=#the-div-element>div</a></code>, <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements, when they have an
- <code title=attr-align>align</code> attribute whose value is an
- <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">right</code>", are expected to right-align text within
- themselves, as if they had their 'text-align' property set to
- 'right' in a <a href=#presentational-hints title="presentational hints">presentational
- hint</a>, and to <a href=#align-descendants>align descendants</a> to the right.</p>
+ <p>The <code><a href=#the-div-element>div</a></code> element, when it has an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">right</code>", is expected to right-align text within
+ itself, as if it had its 'text-align' property set to 'right' in a
+ <a href=#presentational-hints title="presentational hints">presentational hint</a>, and
+ to <a href=#align-descendants>align descendants</a> to the right.</p>
- <p>The <code><a href=#the-div-element>div</a></code>, <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, and <code><a href=#the-th-element>th</a></code> elements, when they have an
- <code title=attr-align>align</code> attribute whose value is an
- <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">justify</code>", are expected to full-justify text within
- themselves, as if they had their 'text-align' property set to
- 'justify' in a <a href=#presentational-hints title="presentational hints">presentational
- hint</a>, and to <a href=#align-descendants>align descendants</a> to the left.</p>
+ <p>The <code><a href=#the-div-element>div</a></code> element, when it has an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">justify</code>", is expected to full-justify text within
+ itself, as if it had its 'text-align' property set to 'justify' in a
+ <a href=#presentational-hints title="presentational hints">presentational hint</a>, and
+ to <a href=#align-descendants>align descendants</a> to the left.</p>
- <p>When a user agent is to <dfn id=align-descendants>align descendants</dfn> of a node,
- the user agent is expected to align only those descendants that have
- both their 'margin-left' and 'margin-right' properties computing to
- a value other than 'auto', that are over-constrained and that have
- one of those two margins with a used value forced to a greater
- value, and that do not themselves have an applicable <code title=attr-align>align</code> attribute. When multiple elements
- are to <a href=#align-descendants title="align descendants">align</a> a particular
- descendant, the most deeply nested such element is expected to
- override the others.</p>
- <p>User agents are expected to have a rule in their user agent
- stylesheet that matches <code><a href=#the-th-element>th</a></code> elements that have a parent
- node whose computed value for the 'text-align' property is its
- initial value, whose declaration block consists of just a single
- declaration that sets the 'text-align' property to the value
- 'center'.</p> <!-- q.v. '-moz-center-or-inherit' -->
- </div>
+ <h4 id=phrasing-content-1><span class=secno>13.3.4 </span>Phrasing content</h4>
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
- <div class=impl>
+cite, dfn, em, i, var { font-style: italic; }
+b, strong { font-weight: bold; }
+code, kbd, samp, tt { font-family: monospace; }
+big { font-size: larger; }
+small { font-size: smaller; }
- <h4 id=fonts-and-colors><span class=secno>13.2.5 </span>Fonts and colors</h4>
+sub { vertical-align: sub; }
+sup { vertical-align: super; }
+sub, sup { line-height: normal; font-size: smaller; }
- <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+ruby { display: ruby; }
+rt { display: ruby-text; }
-address, cite, dfn, em, i, var { font-style: italic; }
-b, strong, th { font-weight: bold; }
-code, kbd, listing, plaintext, pre, samp, tt, xmp { font-family: monospace; }
-h1 { font-size: 2.00em; font-weight: bold; }
-h2 { font-size: 1.50em; font-weight: bold; }
-h3 { font-size: 1.17em; font-weight: bold; }
-h4 { font-size: 1.00em; font-weight: bold; }
-h5 { font-size: 0.83em; font-weight: bold; }
-h6 { font-size: 0.67em; font-weight: bold; }
-big { font-size: larger; }
-small, sub, sup { font-size: smaller; }
-sub, sup { line-height: normal; }
-
:link { color: blue; }
:visited { color: purple; }
+:link, :visited { text-decoration: underline; }
+
+:focus { outline: auto; }
+
mark { background: yellow; color: black; }
-table, td, th { border-color: gray; }
-thead, tbody, tfoot, tr { border-color: inherit; }
-table[rules=none], table[rules=groups], table[rules=rows],
-table[rules=cols], table[rules=all], table[frame=void],
-table[frame=above], table[frame=below], table[frame=hsides],
-table[frame=lhs], table[frame=rhs], table[frame=vsides],
-table[frame=box], table[frame=border],
-table[rules=none] > tr > td, table[rules=none] > tr > th,
-table[rules=groups] > tr > td, table[rules=groups] > tr > th,
-table[rules=rows] > tr > td, table[rules=rows] > tr > th,
-table[rules=cols] > tr > td, table[rules=cols] > tr > th,
-table[rules=all] > tr > td, table[rules=all] > tr > th,
-table[rules=none] > thead > tr > td, table[rules=none] > thead > tr > th,
-table[rules=groups] > thead > tr > td, table[rules=groups] > thead > tr > th,
-table[rules=rows] > thead > tr > td, table[rules=rows] > thead > tr > th,
-table[rules=cols] > thead > tr > td, table[rules=cols] > thead > tr > th,
-table[rules=all] > thead > tr > td, table[rules=all] > thead > tr > th,
-table[rules=none] > tbody > tr > td, table[rules=none] > tbody > tr > th,
-table[rules=groups] > tbody > tr > td, table[rules=groups] > tbody > tr > th,
-table[rules=rows] > tbody > tr > td, table[rules=rows] > tbody > tr > th,
-table[rules=cols] > tbody > tr > td, table[rules=cols] > tbody > tr > th,
-table[rules=all] > tbody > tr > td, table[rules=all] > tbody > tr > th,
-table[rules=none] > tfoot > tr > td, table[rules=none] > tfoot > tr > th,
-table[rules=groups] > tfoot > tr > td, table[rules=groups] > tfoot > tr > th,
-table[rules=rows] > tfoot > tr > td, table[rules=rows] > tfoot > tr > th,
-table[rules=cols] > tfoot > tr > td, table[rules=cols] > tfoot > tr > th,
-table[rules=all] > tfoot > tr > td, table[rules=all] > tfoot > tr > th { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
- border-color: black;
-}</pre>
+abbr[title], acronym[title] { text-decoration: dotted underline; }<!-- CSS3 http://dev.w3.org/csswg/css3-text/#text-decoration-style -->
+ins, u { text-decoration: underline; }
+del, s, strike { text-decoration: line-through; }
+blink { text-decoration: blink; }
- <hr><p>The initial value for the 'color' property is expected to be
- black. The initial value for the 'background-color' property is
- expected to be 'transparent'. The canvas' background is expected to
- be white.</p>
+q::before { content: open-quote; }
+q::after { content: close-quote; }
- <hr><p>The <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>,
- and <code><a href=#the-section-element>section</a></code> elements are expected to affect the font
- size of <code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h1</a></code> elements, based on the nesting depth. If
- <var title="">x</var> is a selector that matches elements that are
- either <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>,
- or <code><a href=#the-section-element>section</a></code> elements, then the following rules capture
- what is expected:</p>
+br { content: '\A'; white-space: pre; }
+nobr { white-space: nowrap; }</pre>
+ <p>The following rules are also expected to apply, as
+ <a href=#presentational-hints>presentational hints</a>:</p>
+
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-<var title="">x</var> h1 { font-size: 1.50em; }
-<var title="">x</var> <var title="">x</var> h1 { font-size: 1.17em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { font-size: 1.00em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { font-size: 0.83em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { font-size: 0.67em; }</pre>
+br[clear=left] { clear: left; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+br[clear=right] { clear: right; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+br[clear=all], br[clear=both] { clear: both; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */</pre>
- <hr><p>When a <code><a href=#the-body-element>body</a></code>, <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> element has a <code title=attr-background><a href=#attr-background>background</a></code> attribute set to a
- non-empty value, the new value is expected to be <a href=#resolve-a-url title="resolve a url">resolved</a> relative to the element, and
- if this is successful, the user agent is expected to treat the
- attribute as a <a href=#presentational-hints title="presentational hints">presentational
- hint</a> setting the element's 'background-image' property to the
- resulting <a href=#absolute-url>absolute URL</a>.</p>
+ <p>For the purposes of the CSS ruby model, runs of children of
+ <code><a href=#the-ruby-element>ruby</a></code> elements that are not <code><a href=#the-rt-element>rt</a></code> or
+ <code><a href=#the-rp-element>rp</a></code> elements are expected to be wrapped in anonymous
+ boxes whose 'display' property has the value 'ruby-base'. <a href=#refsCSSRUBY>[CSSRUBY]</a></p>
- <p>When a <code><a href=#the-body-element>body</a></code>, <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>,
- <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
- <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> element has a <code title="">bgcolor</code> attribute set, the new value is expected to
- be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
- value</a>, and if that does not return an error, the user agent
- is expected to treat the attribute as a <a href=#presentational-hints title="presentational
- hints">presentational hint</a> setting the element's
- 'background-color' property to the resulting color.</p>
+ <p>User agents that do not support correct ruby rendering are
+ expected to render parentheses around the text of <code><a href=#the-rt-element>rt</a></code>
+ elements in the absence of <code><a href=#the-rp-element>rp</a></code> elements.</p>
- <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-text><a href=#attr-body-text>text</a></code> attribute, its value is expected
- to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
- value</a>, and if that does not return an error, the user
- agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
- element's 'color' property to the resulting color.</p>
+ <p>Rules setting the 'quotes' property appropriately for the locales
+ and languages understood by the user are expected to be present.</p>
- <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-link><a href=#attr-body-link>link</a></code> attribute, its value is expected
- to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
- value</a>, and if that does not return an error, the user agent
- is expected to treat the attribute as a <a href=#presentational-hints title="presentational
- hints">presentational hint</a> setting the 'color' property of
- any element in the <code><a href=#document>Document</a></code> matching the ':link'
- pseudo-class to the resulting color.</p>
+ <hr><p>User agents are expected to
+ support the 'clear' property on inline elements (in order to render
+ <code><a href=#the-br-element>br</a></code> elements with <code title=attr-br-clear><a href=#attr-br-clear>clear</a></code> attributes) in the manner
+ described in the non-normative note to this effect in CSS2.1.</p>
+ <!-- section 9.5.2 of CSS2.1 -->
- <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-vlink><a href=#attr-body-vlink>vlink</a></code> attribute, its value is
- expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
- color value</a>, and if that does not return an error, the user
- agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
- 'color' property of any element in the <code><a href=#document>Document</a></code>
- matching the ':visited' pseudo-class to the resulting color.</p>
+ <p>The <code><a href=#the-wbr-element>wbr</a></code> element is expected to override the
+ 'white-space' property and always provide a line-breaking
+ opportunity.</p>
- <p>When a <code><a href=#the-body-element>body</a></code> element has a <code title=attr-body-alink><a href=#attr-body-alink>alink</a></code> attribute, its value is
- expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
- color value</a>, and if that does not return an error, the user
- agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
- 'color' property of any element in the <code><a href=#document>Document</a></code>
- matching the ':active' pseudo-class and either the ':link'
- pseudo-class or the ':visited' pseudo-class to the resulting
- color.</p>
+ <p>The initial value for the 'color' property is expected to be
+ black. The initial value for the 'background-color' property is
+ expected to be 'transparent'. The canvas' background is expected to
+ be white.</p>
- <p>When a <code><a href=#the-table-element>table</a></code> element has a <code title=attr-table-bordercolor>bordercolor</code> attribute, its
- value is expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a
- legacy color value</a>, and if that does not return an error, the
- user agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
- element's 'border-top-color', 'border-right-color',
- 'border-bottom-color', and 'border-right-color' properties to the
- resulting color.</p>
-
<hr><p>When a <code><a href=#font>font</a></code> element has a <code title=attr-font-color>color</code> attribute, its value is
expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy
color value</a>, and if that does not return an error, the user
@@ -87990,37 +87773,76 @@
</li>
- </ol></div>
+ </ol><h4 id=bidirectional-text><span class=secno>13.3.5 </span>Bidirectional text</h4>
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
- <div class=impl>
+:ltr { direction: ltr; }
+:rtl { direction: rtl; }
+[dir] { unicode-bidi: embed; }
+bdi, output, [dir=auto] { unicode-bidi: isolate; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+bdo, bdo[dir] { unicode-bidi: bidi-override; }
+bdo[dir=auto] { unicode-bidi: bidi-override isolate; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+textarea[dir=auto], pre[dir=auto] { unicode-bidi: plaintext; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */</pre>
- <h4 id=punctuation-and-decorations><span class=secno>13.2.6 </span>Punctuation and decorations</h4>
+ <h4 id=sections-and-headings><span class=secno>13.3.6 </span>Sections and headings</h4>
+
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-:link, :visited, ins, u { text-decoration: underline; }
-abbr[title], acronym[title] { text-decoration: dotted underline; }<!-- CSS3 http://dev.w3.org/csswg/css3-text/#text-decoration-style -->
-del, s, strike { text-decoration: line-through; }
-blink { text-decoration: blink; }
+article, aside, h1, h2, h3, h4, h5, h6, hgroup, nav, section {
+ display: block; unicode-bidi: isolate;
+}
-:focus { outline: auto; }
+h1 { margin-top: 0.67em; margin-bottom: 0.67em; font-size: 2.00em; font-weight: bold; }
+h2 { margin-top: 0.83em; margin-bottom: 0.83em; font-size: 1.50em; font-weight: bold; }
+h3 { margin-top: 1.00em; margin-bottom: 1.00em; font-size: 1.17em; font-weight: bold; }
+h4 { margin-top: 1.33em; margin-bottom: 1.33em; font-size: 1.00em; font-weight: bold; }
+h5 { margin-top: 1.67em; margin-bottom: 1.67em; font-size: 0.83em; font-weight: bold; }
+h6 { margin-top: 2.33em; margin-bottom: 2.33em; font-size: 0.67em; font-weight: bold; }</pre>
-q:before { content: open-quote; }
-q:after { content: close-quote; }
+ <p>The <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>, <code><a href=#the-nav-element>nav</a></code>,
+ and <code><a href=#the-section-element>section</a></code> elements are expected to affect the margins
+ and font size of <code><a href=#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements>h1</a></code> elements, based on the nesting
+ depth. If <var title="">x</var> is a selector that matches elements
+ that are either <code><a href=#the-article-element>article</a></code>, <code><a href=#the-aside-element>aside</a></code>,
+ <code><a href=#the-nav-element>nav</a></code>, or <code><a href=#the-section-element>section</a></code> elements, then the
+ following rules capture what is expected:</p>
-br { content: '\A'; white-space: pre; }
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-nobr { white-space: nowrap; }
-listing, plaintext, pre, xmp { white-space: pre; }
-textarea { white-space: pre-wrap; }
+<var title="">x</var> h1 { margin-top: 0.83em; margin-bottom: 0.83em; font-size: 1.50em; }
+<var title="">x</var> <var title="">x</var> h1 { margin-top: 1.00em; margin-bottom: 1.00em; font-size: 1.17em; }
+<var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.33em; margin-bottom: 1.33em; font-size: 1.00em; }
+<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.67em; margin-bottom: 1.67em; font-size: 0.83em; }
+<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 2.33em; margin-bottom: 2.33em; font-size: 0.67em; }</pre>
-ol { list-style-type: decimal; }
-dir, menu, ul {
- list-style-type: disc;
+
+ <h4 id=lists><span class=secno>13.3.7 </span>Lists</h4>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+dir, dd, dl, dt, menu, ol, ul { display: block; unicode-bidi: isolate; }
+li { display: list-item; unicode-bidi: isolate; }
+
+dir, dl, menu, ol, ul { margin-top: 1em; margin-bottom: 1em; }
+
+dir dir, dir dl, dir menu, dir ol, dir ul,
+dl dir, dl dl, dl menu, dl ol, dl ul,
+menu dir, menu dl, menu menu, menu ol, menu ul,
+ol dir, ol dl, ol menu, ol ol, ol ul,
+ul dir, ul dl, ul menu, ul ol, ul ul {
+ margin-top: 0; margin-bottom: 0;
}
+dd { margin-left: 40px; } /* <a href=#ltr-specific>LTR-specific</a>: use 'margin-right' for rtl elements */
+dir, menu, ol, ul { padding-left: 40px; } /* <a href=#ltr-specific>LTR-specific</a>: use 'padding-right' for rtl elements */
+
+ol { list-style-type: decimal; }
+
+dir, menu, ul { list-style-type: disc; }
+
dir dl, dir menu, dir ul,
menu dl, menu menu, menu ul,
ol dl, ol menu, ol ul,
@@ -88045,40 +87867,13 @@
ul ol dl, ul ol menu, ul ol ul,
ul ul dl, ul ul menu, ul ul ul {
list-style-type: square;
-}
+}</pre>
-table { border-style: outset; }
-td, th { border-style: inset; }
-
-:ltr { direction: ltr; }
-:rtl { direction: rtl; }
-[dir] { unicode-bidi: embed; }
-bdi, output, [dir=auto] { unicode-bidi: isolate; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-bdo, bdo[dir] { unicode-bidi: bidi-override; }
-bdo[dir=auto] { unicode-bidi: bidi-override isolate; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-textarea[dir=auto], pre[dir=auto] { unicode-bidi: plaintext; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */</pre>
-
- <p>Rules setting the 'quotes' property appropriately for the locales
- and languages understood by the user are expected to be present.</p>
-
- <p>User agents are expected to
- support the 'clear' property on inline elements (in order to render
- <code><a href=#the-br-element>br</a></code> elements with <code title=attr-br-clear><a href=#attr-br-clear>clear</a></code> attributes) in the manner
- described in the non-normative note to this effect in CSS2.1.</p>
- <!-- section 9.5.2 of CSS2.1 -->
-
- <hr><p id=decohints>The following rules are also expected to apply, as
+ <p>The following rules are also expected to apply, as
<a href=#presentational-hints>presentational hints</a>:</p>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-td[nowrap], th[nowrap] { white-space: nowrap; }
-pre[wrap] { white-space: pre-wrap; }
-
-br[clear=left] { clear: left; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-br[clear=right] { clear: right; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-br[clear=all], br[clear=both] { clear: both; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-
ol[type=1], li[type=1] { list-style-type: decimal; }
ol[type=a], li[type=a] { list-style-type: lower-alpha; }<!-- /* <a href="#case-sensitive-selector-exception">case-sensitive</a> */ -->
ol[type=A], li[type=A] { list-style-type: upper-alpha; }<!-- /* <a href="#case-sensitive-selector-exception">case-sensitive</a> */ -->
@@ -88086,9 +87881,128 @@
ol[type=I], li[type=I] { list-style-type: upper-roman; }<!-- /* <a href="#case-sensitive-selector-exception">case-sensitive</a> */ -->
ul[type=disc], li[type=disc] { list-style-type: disc; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
ul[type=circle], li[type=circle] { list-style-type: circle; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
-ul[type=square], li[type=square] { list-style-type: square; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ul[type=square], li[type=square] { list-style-type: square; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */</pre>
+ <p>When rendering <code><a href=#the-li-element>li</a></code> elements, user agents are expected
+ to use the <a href=#ordinal-value>ordinal value</a> of the <code><a href=#the-li-element>li</a></code> element
+ to render the counter in the list item marker.</p>
+
+
+ <h4 id=tables><span class=secno>13.3.8 </span>Tables</h4>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+table { display: table; unicode-bidi: isolate; }
+caption { display: table-caption; unicode-bidi: isolate; }
+colgroup, colgroup[hidden] { display: table-column-group; unicode-bidi: isolate; }
+col, col[hidden] { display: table-column; unicode-bidi: isolate; }
+thead, thead[hidden] { display: table-header-group; unicode-bidi: isolate; }
+tbody, tbody[hidden] { display: table-row-group; unicode-bidi: isolate; }
+tfoot, tfoot[hidden] { display: table-footer-group; unicode-bidi: isolate; }
+tr, tr[hidden] { display: table-row; unicode-bidi: isolate; }
+td, th, td[hidden], th[hidden] { display: table-cell; unicode-bidi: isolate; }
+
+colgroup[hidden], col[hidden], thead[hidden], tbody[hidden],
+tfoot[hidden], tr[hidden], td[hidden], th[hidden] {
+ visibility: collapse;
+}
+
+table {
+ border-spacing: 2px;
+ border-collapse: separate;
+ border-style: outset;
+ text-indent: initial;
+}
+
+td, th { padding: 1px; border-style: inset; }
+th { font-weight: bold; }
+
+thead, tbody, tfoot, table > tr { vertical-align: middle; }
+tr, td, th { vertical-align: inherit; }
+
+table, td, th { border-color: gray; }
+thead, tbody, tfoot, tr { border-color: inherit; }
table[rules=none], table[rules=groups], table[rules=rows],
+table[rules=cols], table[rules=all], table[frame=void],
+table[frame=above], table[frame=below], table[frame=hsides],
+table[frame=lhs], table[frame=rhs], table[frame=vsides],
+table[frame=box], table[frame=border],
+table[rules=none] > tr > td, table[rules=none] > tr > th,
+table[rules=groups] > tr > td, table[rules=groups] > tr > th,
+table[rules=rows] > tr > td, table[rules=rows] > tr > th,
+table[rules=cols] > tr > td, table[rules=cols] > tr > th,
+table[rules=all] > tr > td, table[rules=all] > tr > th,
+table[rules=none] > thead > tr > td, table[rules=none] > thead > tr > th,
+table[rules=groups] > thead > tr > td, table[rules=groups] > thead > tr > th,
+table[rules=rows] > thead > tr > td, table[rules=rows] > thead > tr > th,
+table[rules=cols] > thead > tr > td, table[rules=cols] > thead > tr > th,
+table[rules=all] > thead > tr > td, table[rules=all] > thead > tr > th,
+table[rules=none] > tbody > tr > td, table[rules=none] > tbody > tr > th,
+table[rules=groups] > tbody > tr > td, table[rules=groups] > tbody > tr > th,
+table[rules=rows] > tbody > tr > td, table[rules=rows] > tbody > tr > th,
+table[rules=cols] > tbody > tr > td, table[rules=cols] > tbody > tr > th,
+table[rules=all] > tbody > tr > td, table[rules=all] > tbody > tr > th,
+table[rules=none] > tfoot > tr > td, table[rules=none] > tfoot > tr > th,
+table[rules=groups] > tfoot > tr > td, table[rules=groups] > tfoot > tr > th,
+table[rules=rows] > tfoot > tr > td, table[rules=rows] > tfoot > tr > th,
+table[rules=cols] > tfoot > tr > td, table[rules=cols] > tfoot > tr > th,
+table[rules=all] > tfoot > tr > td, table[rules=all] > tfoot > tr > th { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ border-color: black;
+}</pre>
+
+ <p>The following rules are also expected to apply, as
+ <a href=#presentational-hints>presentational hints</a>:</p>
+
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+table[align=left] { float: left; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+table[align=right] { float: right; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+table[align=center], table[align=abscenter],
+table[align=absmiddle], table[align=middle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ margin-left: auto; margin-right: auto;
+}
+thead[align=absmiddle], tbody[align=absmiddle], tfoot[align=absmiddle],
+tr[align=absmiddle], td[align=absmiddle], th[align=absmiddle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: center;
+}
+
+caption[align=bottom] { caption-side: bottom; } /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+p[align=left], h1[align=left], h2[align=left], h3[align=left],
+h4[align=left], h5[align=left], h6[align=left] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: left;
+}
+p[align=right], h1[align=right], h2[align=right], h3[align=right],
+h4[align=right], h5[align=right], h6[align=right] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: right;
+}
+p[align=center], h1[align=center], h2[align=center], h3[align=center],
+h4[align=center], h5[align=center], h6[align=center] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: center;
+}
+p[align=justify], h1[align=justify], h2[align=justify], h3[align=justify],
+h4[align=justify], h5[align=justify], h6[align=justify] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ text-align: justify;
+}
+thead[valign=top], tbody[valign=top], tfoot[valign=top],
+tr[valign=top], td[valign=top], th[valign=top] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ vertical-align: top;
+}
+thead[valign=middle], tbody[valign=middle], tfoot[valign=middle],
+tr[valign=middle], td[valign=middle], th[valign=middle] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ vertical-align: middle;
+}
+thead[valign=bottom], tbody[valign=bottom], tfoot[valign=bottom],
+tr[valign=bottom], td[valign=bottom], th[valign=bottom] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ vertical-align: bottom;
+}
+thead[valign=baseline], tbody[valign=baseline], tfoot[valign=baseline],
+tr[valign=baseline], td[valign=baseline], th[valign=baseline] { /* <a href=#case-insensitive-selector-exception>case-insensitive</a> */
+ vertical-align: baseline;
+}
+
+td[nowrap], th[nowrap] { white-space: nowrap; }
+
+table[rules=none], table[rules=groups], table[rules=rows],
table[rules=cols], table[rules=all] {
border-style: none;
border-collapse: collapse;
@@ -88150,11 +88064,162 @@
border-width: 1px;
}</pre>
- <p>When rendering <code><a href=#the-li-element>li</a></code> elements, user agents are expected
- to use the <a href=#ordinal-value>ordinal value</a> of the <code><a href=#the-li-element>li</a></code> element
- to render the counter in the list item marker.</p>
+ <p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
+ expected to apply:</p>
- <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-border><a href=#attr-table-border>border</a></code> attribute <a href=#maps-to-the-pixel-length-property title="maps
+ <pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
+
+table {
+ font-weight: initial;
+ font-style: initial;
+ font-variant: initial;
+ font-size: initial;
+ line-height: initial;
+ white-space: initial;
+ text-align: initial;
+}</pre>
+
+ <hr><p>For the purposes of the CSS table model, the <code><a href=#the-col-element>col</a></code>
+ element is expected to be treated as if it was present as many times
+ as its <code title=attr-col-span><a href=#attr-col-span>span</a></code> attribute <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative
+ integers">specifies</a>.</p>
+
+ <p>For the purposes of the CSS table model, the
+ <code><a href=#the-colgroup-element>colgroup</a></code> element, if it contains no <code><a href=#the-col-element>col</a></code>
+ element, is expected to be treated as if it had as many such
+ children as its <code title=attr-colgroup-span><a href=#attr-colgroup-span>span</a></code>
+ attribute <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative
+ integers">specifies</a>.</p>
+
+ <p>For the purposes of the CSS table model, the <code title=attr-tdth-colspan><a href=#attr-tdth-colspan>colspan</a></code> and <code title=attr-tdth-rowspan><a href=#attr-tdth-rowspan>rowspan</a></code> attributes on
+ <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements are expected to <a href=#rules-for-parsing-non-negative-integers title="rules for parsing non-negative integers">provide</a> the
+ <i>special knowledge</i> regarding cells spanning rows and
+ columns.</p>
+
+ <p>In <a href=#html-documents>HTML documents</a>, the user agent is expected to
+ hide <code><a href=#the-form-element>form</a></code> elements that are children of
+ <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, or <code><a href=#the-tr-element>tr</a></code> elements, irrespective of CSS
+ rules.</p>
+
+ <hr><p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-cellspacing><a href=#attr-table-cellspacing>cellspacing</a></code> attribute
+ <a href=#maps-to-the-pixel-length-property>maps to the pixel length property</a> 'border-spacing' on the
+ element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-cellpadding><a href=#attr-table-cellpadding>cellpadding</a></code> attribute <a href=#maps-to-the-pixel-length-property title="maps to the pixel length property">maps to the pixel length
+ properties</a> 'padding-top', 'padding-right', 'padding-bottom',
+ and 'padding-left' of any <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code>
+ elements that have corresponding <a href=#concept-cell title=concept-cell>cells</a> in the <a href=#concept-table title=concept-table>table</a> corresponding to the
+ <code><a href=#the-table-element>table</a></code> element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-hspace>hspace</code> attribute <a href=#maps-to-the-dimension-property title="maps
+ to the dimension property">maps to the dimension properties</a>
+ 'margin-left' and 'margin-right' on the <code><a href=#the-table-element>table</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-vspace>vspace</code> attribute <a href=#maps-to-the-dimension-property title="maps
+ to the dimension property">maps to the dimension properties</a>
+ 'margin-top' and 'margin-bottom' on the <code><a href=#the-table-element>table</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-height>height</code> attribute <a href=#maps-to-the-dimension-property>maps to the
+ dimension property</a> 'height' on the <code><a href=#the-table-element>table</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-width><a href=#attr-table-width>width</a></code> attribute <a href=#maps-to-the-dimension-property>maps to the
+ dimension property</a> 'width' on the <code><a href=#the-table-element>table</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-col-element>col</a></code> element's <code title=attr-col-width><a href=#attr-col-width>width</a></code> attribute <a href=#maps-to-the-dimension-property>maps to the
+ dimension property</a> 'width' on the <code><a href=#the-col-element>col</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-tr-element>tr</a></code> element's <code title=attr-tr-height>height</code> attribute <a href=#maps-to-the-dimension-property>maps to the
+ dimension property</a> 'height' on the <code><a href=#the-tr-element>tr</a></code>
+ element.</p>
+
+ <p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-height><a href=#attr-tdth-height>height</a></code> attributes <a href=#maps-to-the-dimension-property title="maps
+ to the dimension property">map to the dimension property</a> 'height'
+ on the element.</p>
+
+ <p>The <code><a href=#the-td-element>td</a></code> and <code><a href=#the-th-element>th</a></code> elements' <code title=attr-tdth-width><a href=#attr-tdth-width>width</a></code> attributes <a href=#maps-to-the-dimension-property title="maps
+ to the dimension property">map to the dimension property</a> 'width'
+ on the element.</p>
+
+ <p>When a <code><a href=#document>Document</a></code> is in <a href=#quirks-mode>quirks mode</a>,
+ vertical margins on <a href=#html-elements>HTML elements</a> at the top or bottom
+ of <code><a href=#the-td-element>td</a></code> or <code><a href=#the-th-element>th</a></code> elements are expected to be
+ collapsed to zero.</p>
+
+ <hr><p>The the <code><a href=#the-caption-element>caption</a></code> element unless specified otherwise
+ below, and the <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and
+ <code><a href=#the-th-element>th</a></code> elements when they have an <code title=attr-div-align><a href=#attr-div-align>align</a></code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for either the string
+ "<code title="">center</code>" or the string "<code title="">middle</code>", are expected to center text within
+ themselves, as if they had their 'text-align' property set to
+ 'center' in a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a>, and to <a href=#align-descendants>align descendants</a> to the
+ center.</p>
+
+ <p>The <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and
+ <code><a href=#the-th-element>th</a></code> elements, when they have an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">left</code>", are expected to left-align text within
+ themselves, as if they had their 'text-align' property set to 'left'
+ in a <a href=#presentational-hints title="presentational hints">presentational hint</a>,
+ and to <a href=#align-descendants>align descendants</a> to the left.</p>
+
+ <p>The <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and
+ <code><a href=#the-th-element>th</a></code> elements, when they have an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">right</code>", are expected to right-align text within
+ themselves, as if they had their 'text-align' property set to
+ 'right' in a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a>, and to <a href=#align-descendants>align descendants</a> to the right.</p>
+
+ <p>The <code><a href=#the-caption-element>caption</a></code>, <code><a href=#the-thead-element>thead</a></code>, <code><a href=#the-tbody-element>tbody</a></code>,
+ <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>, <code><a href=#the-td-element>td</a></code>, and
+ <code><a href=#the-th-element>th</a></code> elements, when they have an <code title=attr-align>align</code> attribute whose value is an
+ <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">justify</code>", are expected to full-justify text within
+ themselves, as if they had their 'text-align' property set to
+ 'justify' in a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a>, and to <a href=#align-descendants>align descendants</a> to the left.</p>
+
+ <p>User agents are expected to have a rule in their user agent
+ stylesheet that matches <code><a href=#the-th-element>th</a></code> elements that have a parent
+ node whose computed value for the 'text-align' property is its
+ initial value, whose declaration block consists of just a single
+ declaration that sets the 'text-align' property to the value
+ 'center'.</p> <!-- q.v. '-moz-center-or-inherit' -->
+
+ <hr><p>When a <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>,
+ <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
+ <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> element has a <code title=attr-background><a href=#attr-background>background</a></code> attribute set to a
+ non-empty value, the new value is expected to be <a href=#resolve-a-url title="resolve a url">resolved</a> relative to the element, and
+ if this is successful, the user agent is expected to treat the
+ attribute as a <a href=#presentational-hints title="presentational hints">presentational
+ hint</a> setting the element's 'background-image' property to the
+ resulting <a href=#absolute-url>absolute URL</a>.</p>
+
+ <p>When a <code><a href=#the-table-element>table</a></code>, <code><a href=#the-thead-element>thead</a></code>,
+ <code><a href=#the-tbody-element>tbody</a></code>, <code><a href=#the-tfoot-element>tfoot</a></code>, <code><a href=#the-tr-element>tr</a></code>,
+ <code><a href=#the-td-element>td</a></code>, or <code><a href=#the-th-element>th</a></code> element has a <code title="">bgcolor</code> attribute set, the new value is expected to
+ be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a legacy color
+ value</a>, and if that does not return an error, the user agent
+ is expected to treat the attribute as a <a href=#presentational-hints title="presentational
+ hints">presentational hint</a> setting the element's
+ 'background-color' property to the resulting color.</p>
+
+ <p>When a <code><a href=#the-table-element>table</a></code> element has a <code title=attr-table-bordercolor>bordercolor</code> attribute, its
+ value is expected to be parsed using the <a href=#rules-for-parsing-a-legacy-color-value>rules for parsing a
+ legacy color value</a>, and if that does not return an error, the
+ user agent is expected to treat the attribute as a <a href=#presentational-hints title="presentational hints">presentational hint</a> setting the
+ element's 'border-top-color', 'border-right-color',
+ 'border-bottom-color', and 'border-right-color' properties to the
+ resulting color.</p>
+
+ <hr><p>The <code><a href=#the-table-element>table</a></code> element's <code title=attr-table-border><a href=#attr-table-border>border</a></code> attribute <a href=#maps-to-the-pixel-length-property title="maps
to the pixel length property">maps to the pixel length
properties</a> 'border-top-width', 'border-right-width',
'border-bottom-width', 'border-left-width' on the element. If the
@@ -88174,53 +88239,33 @@
<a href=#table-model>table model</a> as the <code><a href=#the-table-element>table</a></code> element to
zero.</p>
- <p>The <code><a href=#the-wbr-element>wbr</a></code> element is expected to override the
- 'white-space' property and always provide a line-breaking
- opportunity.</p>
- </div>
+ <h4 id=form-controls><span class=secno>13.3.9 </span>Form controls</h4>
- <div class=impl>
-
- <h4 id=resetting-rules-for-inherited-properties><span class=secno>13.2.7 </span>Resetting rules for inherited properties</h4>
-
- <p>The following rules are also expected to be in play, resetting
- certain properties to block inheritance by default.</p>
-
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-table, input, select, option, optgroup, button, textarea, keygen {
+input, select, option, optgroup, button, textarea, keygen {
text-indent: initial;
-}</pre>
+}
- <!-- arguably, the form controls' 'text-indent' lines should be in
- the sections below instead of here, but that would be far more
- complicated than this -->
+textarea { white-space: pre-wrap; }
+</pre>
<p>In <a href=#quirks-mode>quirks mode</a>, the following rules are also
expected to apply:</p>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
-table {
- font-weight: initial;
- font-style: initial;
- font-variant: initial;
- font-size: initial;
- line-height: initial;
- white-space: initial;
- text-align: initial;
-}
-
input { box-sizing: border-box; }</pre>
- </div>
+ <p>Each kind of form control is also given a specific default
+ binding, as described in subsequent sections, which implements the
+ look and feel of the control.</p>
- <div class=impl>
- <h4 id=the-hr-element-0><span class=secno>13.2.8 </span>The <code><a href=#the-hr-element>hr</a></code> element</h4>
+ <h4 id=the-hr-element-0><span class=secno>13.3.10 </span>The <code><a href=#the-hr-element>hr</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -88268,13 +88313,10 @@
hints">presentational hint</a> setting the element's 'color'
property to the resulting color.</p>
- </div>
- <div class=impl>
+ <h4 id=the-fieldset-element-0><span class=secno>13.3.11 </span>The <code><a href=#the-fieldset-element>fieldset</a></code> element</h4>
- <h4 id=the-fieldset-element-0><span class=secno>13.2.9 </span>The <code><a href=#the-fieldset-element>fieldset</a></code> element</h4>
-
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
fieldset {
@@ -88320,15 +88362,10 @@
<td>On the right
<tr><td><code title="">center</code>
<td>In the middle
- </table></div>
+ </table><h3 id=replaced-elements><span class=secno>13.4 </span>Replaced elements</h3>
+ <h4 id=embedded-content-2><span class=secno>13.4.1 </span>Embedded content</h4>
- <div class=impl>
-
- <h3 id=replaced-elements><span class=secno>13.3 </span>Replaced elements</h3>
-
- <h4 id=embedded-content-2><span class=secno>13.3.1 </span>Embedded content</h4>
-
<p>The <code><a href=#the-embed-element>embed</a></code>, <code><a href=#the-iframe-element>iframe</a></code>, and
<code><a href=#the-video-element>video</a></code> elements are expected to be treated as replaced
elements.</p>
@@ -88400,14 +88437,14 @@
<div class=impl>
- <h4 id=timed-text-tracks-0><span class=secno>13.3.2 </span>Timed text tracks</h4>
+ <h4 id=timed-text-tracks-0><span class=secno>13.4.2 </span>Timed text tracks</h4>
<p class=note>This section is intended to be moved to its own CSS
module once an editor is found to run with it.</p>
- <h5 id=webvtt-cue-text-rendering-rules><span class=secno>13.3.2.1 </span><dfn>WebVTT cue text rendering rules</dfn></h5>
+ <h5 id=webvtt-cue-text-rendering-rules><span class=secno>13.4.2.1 </span><dfn>WebVTT cue text rendering rules</dfn></h5>
<p>The <dfn id=rules-for-updating-the-display-of-webvtt-text-tracks>rules for updating the display of WebVTT text
tracks</dfn> render the <a href=#text-track title="text track">text
@@ -88963,7 +89000,7 @@
entirely.</p>
- <h5 id=applying-css-properties-to-webvtt-node-objects><span class=secno>13.3.2.2 </span>Applying CSS properties to <a href=#webvtt-node-object title="WebVTT Node Object">WebVTT Node Objects</a></h5>
+ <h5 id=applying-css-properties-to-webvtt-node-objects><span class=secno>13.4.2.2 </span>Applying CSS properties to <a href=#webvtt-node-object title="WebVTT Node Object">WebVTT Node Objects</a></h5>
<p>When following the <a href=#rules-for-updating-the-display-of-webvtt-text-tracks>rules for updating the display of WebVTT
text tracks</a>, user agents must set properties of <a href=#webvtt-node-object title="WebVTT Node Object">WebVTT Node Objects</a> as defined in
@@ -89026,7 +89063,7 @@
values.</p>
- <h5 id=css-extensions><span class=secno>13.3.2.3 </span>CSS extensions</h5>
+ <h5 id=css-extensions><span class=secno>13.4.2.3 </span>CSS extensions</h5>
<p>When a user agent is rendering one or more <a href=#text-track-cue title="text
track cue">text track cues</a> according to the <a href=#webvtt-cue-text-rendering-rules>WebVTT cue
@@ -89058,7 +89095,7 @@
':past' and ':future' pseudo-classes.</p>
- <h6 id="the-'::cue'-pseudo-element"><span class=secno>13.3.2.3.1 </span>The '::cue' pseudo-element</h6>
+ <h6 id="the-'::cue'-pseudo-element"><span class=secno>13.4.2.3.1 </span>The '::cue' pseudo-element</h6>
<p>The '<dfn id=pseudo-cue title=pseudo-cue>::cue</dfn>' pseudo-element (with no
argument) matches any <a href=#list-of-webvtt-node-objects>List of WebVTT Node Objects</a>
@@ -89200,7 +89237,7 @@
the <a href=#webvtt-cue-background-box>WebVTT cue background box</a>.</p>
- <h6 id="the-':past'-and-':future'-pseudo-classes"><span class=secno>13.3.2.3.2 </span>The ':past' and ':future' pseudo-classes</h6>
+ <h6 id="the-':past'-and-':future'-pseudo-classes"><span class=secno>13.4.2.3.2 </span>The ':past' and ':future' pseudo-classes</h6>
<p>The <dfn id=past-pseudo-class title=past-pseudo-class>':past'</dfn> and <dfn id=future-pseudo-class title=future-pseudo-class>':future'</dfn> pseudo-classes only
match <a href=#webvtt-node-object title="WebVTT Node Object">WebVTT Node Objects</a>.</p>
@@ -89238,7 +89275,7 @@
<div class=impl>
- <h4 id=images-0><span class=secno>13.3.3 </span>Images</h4>
+ <h4 id=images-0><span class=secno>13.4.3 </span>Images</h4>
<p>When an <code><a href=#the-img-element>img</a></code> element or an <code><a href=#the-input-element>input</a></code> element
when its <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in
@@ -89320,7 +89357,7 @@
<div class=impl>
- <h4 id=attributes-for-embedded-content-and-images><span class=secno>13.3.4 </span>Attributes for embedded content and images</h4>
+ <h4 id=attributes-for-embedded-content-and-images><span class=secno>13.4.4 </span>Attributes for embedded content and images</h4>
<p>The following CSS rules are expected to apply as
<a href=#presentational-hints>presentational hints</a>:</p>
@@ -89416,7 +89453,7 @@
<div class=impl>
- <h4 id=image-maps-0><span class=secno>13.3.5 </span>Image maps</h4>
+ <h4 id=image-maps-0><span class=secno>13.4.5 </span>Image maps</h4>
<p>Shapes on an <a href=#image-map>image map</a> are expected to act, for the
purpose of the CSS cascade, as elements independent of the original
@@ -89444,7 +89481,7 @@
<div class=impl>
- <h4 id=toolbars-0><span class=secno>13.3.6 </span>Toolbars</h4>
+ <h4 id=toolbars-0><span class=secno>13.4.6 </span>Toolbars</h4>
<p>When a <code><a href=#the-menu-element>menu</a></code> element's <code title=attr-menu-type><a href=#attr-menu-type>type</a></code> attribute is in the <a href=#toolbar-state title="toolbar state">toolbar</a> state, the element is
expected to be treated as a replaced element with a height about two
@@ -89460,9 +89497,9 @@
<div class=impl>
- <h3 id=bindings><span class=secno>13.4 </span>Bindings</h3>
+ <h3 id=bindings><span class=secno>13.5 </span>Bindings</h3>
- <h4 id=introduction-16><span class=secno>13.4.1 </span>Introduction</h4>
+ <h4 id=introduction-15><span class=secno>13.5.1 </span>Introduction</h4>
<p>A number of elements have their rendering defined in terms of the
'binding' property. <a href=#refsBECSS>[BECSS]</a></p>
@@ -89485,7 +89522,7 @@
<div class=impl>
- <h4 id=the-button-element-0><span class=secno>13.4.2 </span>The <code><a href=#the-button-element>button</a></code> element</h4>
+ <h4 id=the-button-element-0><span class=secno>13.5.2 </span>The <code><a href=#the-button-element>button</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89501,7 +89538,7 @@
<div class=impl>
- <h4 id=the-details-element-0><span class=secno>13.4.3 </span>The <code><a href=#the-details-element>details</a></code> element</h4>
+ <h4 id=the-details-element-0><span class=secno>13.5.3 </span>The <code><a href=#the-details-element>details</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89536,7 +89573,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-text-entry-widget><span class=secno>13.4.4 </span>The <code><a href=#the-input-element>input</a></code> element as a text entry widget</h4>
+ <h4 id=the-input-element-as-a-text-entry-widget><span class=secno>13.5.4 </span>The <code><a href=#the-input-element>input</a></code> element as a text entry widget</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89583,7 +89620,7 @@
<div class=impl>
- <h4 id=the-input-element-as-domain-specific-widgets><span class=secno>13.4.5 </span>The <code><a href=#the-input-element>input</a></code> element as domain-specific widgets</h4>
+ <h4 id=the-input-element-as-domain-specific-widgets><span class=secno>13.5.5 </span>The <code><a href=#the-input-element>input</a></code> element as domain-specific widgets</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89638,7 +89675,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-range-control><span class=secno>13.4.6 </span>The <code><a href=#the-input-element>input</a></code> element as a range control</h4>
+ <h4 id=the-input-element-as-a-range-control><span class=secno>13.5.6 </span>The <code><a href=#the-input-element>input</a></code> element as a range control</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89664,7 +89701,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-color-well><span class=secno>13.4.7 </span>The <code><a href=#the-input-element>input</a></code> element as a color well</h4>
+ <h4 id=the-input-element-as-a-color-well><span class=secno>13.5.7 </span>The <code><a href=#the-input-element>input</a></code> element as a color well</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89686,7 +89723,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-checkbox-and-radio-button-widgets><span class=secno>13.4.8 </span>The <code><a href=#the-input-element>input</a></code> element as a checkbox and radio button widgets</h4>
+ <h4 id=the-input-element-as-a-checkbox-and-radio-button-widgets><span class=secno>13.5.8 </span>The <code><a href=#the-input-element>input</a></code> element as a checkbox and radio button widgets</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89708,7 +89745,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-file-upload-control><span class=secno>13.4.9 </span>The <code><a href=#the-input-element>input</a></code> element as a file upload control</h4>
+ <h4 id=the-input-element-as-a-file-upload-control><span class=secno>13.5.9 </span>The <code><a href=#the-input-element>input</a></code> element as a file upload control</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89726,7 +89763,7 @@
<div class=impl>
- <h4 id=the-input-element-as-a-button><span class=secno>13.4.10 </span>The <code><a href=#the-input-element>input</a></code> element as a button</h4>
+ <h4 id=the-input-element-as-a-button><span class=secno>13.5.10 </span>The <code><a href=#the-input-element>input</a></code> element as a button</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89747,7 +89784,7 @@
<div class=impl>
- <h4 id=the-marquee-element-0><span class=secno>13.4.11 </span>The <code><a href=#the-marquee-element>marquee</a></code> element</h4>
+ <h4 id=the-marquee-element-0><span class=secno>13.5.11 </span>The <code><a href=#the-marquee-element>marquee</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89911,7 +89948,7 @@
<div class=impl>
- <h4 id=the-meter-element-0><span class=secno>13.4.12 </span>The <code><a href=#the-meter-element>meter</a></code> element</h4>
+ <h4 id=the-meter-element-0><span class=secno>13.5.12 </span>The <code><a href=#the-meter-element>meter</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89942,7 +89979,7 @@
<div class=impl>
- <h4 id=the-progress-element-0><span class=secno>13.4.13 </span>The <code><a href=#the-progress-element>progress</a></code> element</h4>
+ <h4 id=the-progress-element-0><span class=secno>13.5.13 </span>The <code><a href=#the-progress-element>progress</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -89988,7 +90025,7 @@
<div class=impl>
- <h4 id=the-select-element-0><span class=secno>13.4.14 </span>The <code><a href=#the-select-element>select</a></code> element</h4>
+ <h4 id=the-select-element-0><span class=secno>13.5.14 </span>The <code><a href=#the-select-element>select</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -90056,7 +90093,7 @@
<div class=impl>
- <h4 id=the-textarea-element-0><span class=secno>13.4.15 </span>The <code><a href=#the-textarea-element>textarea</a></code> element</h4>
+ <h4 id=the-textarea-element-0><span class=secno>13.5.15 </span>The <code><a href=#the-textarea-element>textarea</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -90111,7 +90148,7 @@
<div class=impl>
- <h4 id=the-keygen-element-0><span class=secno>13.4.16 </span>The <code><a href=#the-keygen-element>keygen</a></code> element</h4>
+ <h4 id=the-keygen-element-0><span class=secno>13.5.16 </span>The <code><a href=#the-keygen-element>keygen</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -90127,7 +90164,7 @@
<div class=impl>
- <h4 id=the-time-element-0><span class=secno>13.4.17 </span>The <code><a href=#the-time-element>time</a></code> element</h4>
+ <h4 id=the-time-element-0><span class=secno>13.5.17 </span>The <code><a href=#the-time-element>time</a></code> element</h4>
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);
@@ -90147,7 +90184,7 @@
<div class=impl>
- <h3 id=frames-and-framesets><span class=secno>13.5 </span>Frames and framesets</h3>
+ <h3 id=frames-and-framesets><span class=secno>13.6 </span>Frames and framesets</h3>
<p>When an <code><a href=#the-html-element>html</a></code> element's second child element is a
<code><a href=#frameset>frameset</a></code> element, the user agent is expected to render
@@ -90432,9 +90469,9 @@
<div class=impl>
- <h3 id=interactive-media><span class=secno>13.6 </span>Interactive media</h3>
+ <h3 id=interactive-media><span class=secno>13.7 </span>Interactive media</h3>
- <h4 id=links,-forms,-and-navigation><span class=secno>13.6.1 </span>Links, forms, and navigation</h4>
+ <h4 id=links,-forms,-and-navigation><span class=secno>13.7.1 </span>Links, forms, and navigation</h4>
<p>User agents are expected to allow the user to control aspects of
<a href=#hyperlink>hyperlink</a> activation and <a href=#form-submission>form submission</a>,
@@ -90470,7 +90507,7 @@
- <h4 id=the-title-attribute-0><span class=secno>13.6.2 </span>The <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute</h4>
+ <h4 id=the-title-attribute-0><span class=secno>13.7.2 </span>The <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute</h4>
<p>Given an element (e.g. the element designated by the mouse
cursor), if the element, or one of its ancestors, has a <code title=attr-title><a href=#the-title-attribute>title</a></code> attribute, and the nearest such
@@ -90508,7 +90545,7 @@
</div>
- <h4 id=editing-hosts><span class=secno>13.6.3 </span>Editing hosts</h4>
+ <h4 id=editing-hosts><span class=secno>13.7.3 </span>Editing hosts</h4>
<p>The current text editing caret (the one at the <a href=#caret-position>caret
position</a> in a focused <a href=#editing-host>editing host</a>) is expected
@@ -90522,7 +90559,7 @@
- <h4 id=text-rendered-in-native-user-interfaces><span class=secno>13.6.4 </span>Text rendered in native user interfaces</h4>
+ <h4 id=text-rendered-in-native-user-interfaces><span class=secno>13.7.4 </span>Text rendered in native user interfaces</h4>
<p>User agents are expected to honor the Unicode semantics of text
that is exposed in user interfaces, for example supporting the
@@ -90618,7 +90655,7 @@
- <h3 id=print-media><span class=secno>13.7 </span>Print media</h3>
+ <h3 id=print-media><span class=secno>13.8 </span>Print media</h3>
<p>User agents are expected to allow the user to request the
opportunity to <dfn id=obtain-a-physical-form>obtain a physical form</dfn> (or a
Modified: source
===================================================================
--- source 2011-06-30 23:52:43 UTC (rev 6275)
+++ source 2011-07-02 00:12:59 UTC (rev 6276)
@@ -104032,15 +104032,10 @@
element is not <span>being rendered</span>, though this might be
overridden by the style sheets.</p>
- </div>
- <div class="impl">
-
<h3>The CSS user agent style sheet and presentational hints</h3>
- <h4>Introduction</h4>
-
<p>The CSS rules given in these subsections are, except where
otherwise specified, expected to be used as part of the user-agent
level style sheet defaults for all documents that contain <span>HTML
@@ -104098,143 +104093,43 @@
the dimension was an integer, and with the value given as a
percentage if the dimension was a percentage.</p>
- </div>
+ <p>When a user agent is to <dfn>align descendants</dfn> of a node,
+ the user agent is expected to align only those descendants that have
+ both their 'margin-left' and 'margin-right' properties computing to
+ a value other than 'auto', that are over-constrained and that have
+ one of those two margins with a used value forced to a greater
+ value, and that do not themselves have an applicable <code
+ title="attr-align">align</code> attribute. When multiple elements
+ are to <span title="align descendants">align</span> a particular
+ descendant, the most deeply nested such element is expected to
+ override the others.</p>
- <div class="impl">
- <h4>Display types</h4>
+ <h3>Non-replaced elements</h3>
+
+ <h4>Hidden elements</h4>
+
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
[hidden], area, base, basefont, command, datalist, head,
input[type=hidden], link, menu[type=context], meta, noembed, noframes,
param, rp, script, source, style, track, title { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
display: none;
-}
+}</pre>
-address, article, aside, blockquote, body, center, dd, dir, div, dl,
-dt, figure, figcaption, footer, form, h1, h2, h3, h4, h5, h6, header,
-hgroup, hr, html, legend, listing, menu, nav, ol, p, plaintext, pre,
-section, summary, ul, xmp { display: block; unicode-bidi: isolate; }
-
-table { display: table; unicode-bidi: isolate; }
-caption { display: table-caption; unicode-bidi: isolate; }
-colgroup, colgroup[hidden] { display: table-column-group; unicode-bidi: isolate; }
-col, col[hidden] { display: table-column; unicode-bidi: isolate; }
-thead, thead[hidden] { display: table-header-group; unicode-bidi: isolate; }
-tbody, tbody[hidden] { display: table-row-group; unicode-bidi: isolate; }
-tfoot, tfoot[hidden] { display: table-footer-group; unicode-bidi: isolate; }
-tr, tr[hidden] { display: table-row; unicode-bidi: isolate; }
-td, th, td[hidden], th[hidden] { display: table-cell; unicode-bidi: isolate; }
-
-colgroup[hidden], col[hidden], thead[hidden], tbody[hidden],
-tfoot[hidden], tr[hidden], td[hidden], th[hidden] {
- visibility: collapse;
-}
-
-li { display: list-item; unicode-bidi: isolate; }
-
-ruby { display: ruby; }
-rt { display: ruby-text; }</pre>
-
- <!-- del, ins, and map are inline. -->
-
- <p>For the purposes of the CSS table model, the <code>col</code>
- element is expected to be treated as if it was present as many times
- as its <code title="attr-col-span">span</code> attribute <span
- title="rules for parsing non-negative
- integers">specifies</span>.</p>
-
- <p>For the purposes of the CSS table model, the
- <code>colgroup</code> element, if it contains no <code>col</code>
- element, is expected to be treated as if it had as many such
- children as its <code title="attr-colgroup-span">span</code>
- attribute <span title="rules for parsing non-negative
- integers">specifies</span>.</p>
-
- <p>For the purposes of the CSS table model, the <code
- title="attr-tdth-colspan">colspan</code> and <code
- title="attr-tdth-rowspan">rowspan</code> attributes on
- <code>td</code> and <code>th</code> elements are expected to <span
- title="rules for parsing non-negative integers">provide</span> the
- <i>special knowledge</i> regarding cells spanning rows and
- columns.</p>
-
- <p>For the purposes of the CSS ruby model, runs of children of
- <code>ruby</code> elements that are not <code>rt</code> or
- <code>rp</code> elements are expected to be wrapped in anonymous
- boxes whose 'display' property has the value 'ruby-base'. <a
- href="#refsCSSRUBY">[CSSRUBY]</a></p>
-
- <p>User agents that do not support correct ruby rendering are
- expected to render parentheses around the text of <code>rt</code>
- elements in the absence of <code>rp</code> elements.</p>
-
<p>The user agent is expected to hide <code>noscript</code> elements
for whom <span title="concept-n-script">scripting is enabled</span>,
irrespective of CSS rules.</p>
- <p>In <span>HTML documents</span>, the user agent is expected to
- hide <code>form</code> elements that are children of
- <code>table</code>, <code>thead</code>, <code>tbody</code>,
- <code>tfoot</code>, or <code>tr</code> elements, irrespective of CSS
- rules.</p>
- </div>
+ <h4>The page</h4>
-
- <div class="impl">
-
- <h4>Margins and padding</h4>
-
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-blockquote, dir, dl, figure, listing, menu, ol, p, plaintext,
-pre, ul, xmp {
- margin-top: 1em; margin-bottom: 1em;
-}
+html, body { display: block; }</pre>
-dir dir, dir dl, dir menu, dir ol, dir ul,
-dl dir, dl dl, dl menu, dl ol, dl ul,
-menu dir, menu dl, menu menu, menu ol, menu ul,
-ol dir, ol dl, ol menu, ol ol, ol ul,
-ul dir, ul dl, ul menu, ul ol, ul ul {
- margin-top: 0; margin-bottom: 0;
-}
-
-h1 { margin-top: 0.67em; margin-bottom: 0.67em; }
-h2 { margin-top: 0.83em; margin-bottom: 0.83em; }
-h3 { margin-top: 1.00em; margin-bottom: 1.00em; }
-h4 { margin-top: 1.33em; margin-bottom: 1.33em; }
-h5 { margin-top: 1.67em; margin-bottom: 1.67em; }
-h6 { margin-top: 2.33em; margin-bottom: 2.33em; }
-
-dd { margin-left: 40px; } /* <span>LTR-specific</span>: use 'margin-right' for rtl elements */
-dir, menu, ol, ul { padding-left: 40px; } /* <span>LTR-specific</span>: use 'padding-right' for rtl elements */
-blockquote, figure { margin-left: 40px; margin-right: 40px; }
-
-table { border-spacing: 2px; border-collapse: separate; }
-td, th { padding: 1px; }</pre>
-
- <p>The <code>article</code>, <code>aside</code>, <code>nav</code>,
- and <code>section</code> elements are expected to affect the margins
- of <code>h1</code> elements, based on the nesting depth. If <var
- title="">x</var> is a selector that matches elements that are either
- <code>article</code>, <code>aside</code>, <code>nav</code>, or
- <code>section</code> elements, then the following rules capture what
- is expected:</p>
-
- <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-
-<var title="">x</var> h1 { margin-top: 0.83em; margin-bottom: 0.83em; }
-<var title="">x</var> <var title="">x</var> h1 { margin-top: 1.00em; margin-bottom: 1.00em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.33em; margin-bottom: 1.33em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.67em; margin-bottom: 1.67em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 2.33em; margin-bottom: 2.33em; }</pre>
-
- <hr>
-
<p>For each property in the table below, given a <code>body</code>
element, the first attribute that exists <span>maps to the pixel
length property</span> on the <code>body</code> element. If none of
@@ -104347,148 +104242,109 @@
<hr>
- <p>The <code>table</code> element's <code
- title="attr-table-cellspacing">cellspacing</code> attribute
- <span>maps to the pixel length property</span> 'border-spacing' on the
- element.</p>
+ <p>When a <code>Document</code> is in <span>quirks mode</span>,
+ vertical margins on <span>HTML elements</span> at the top or bottom
+ of <code>body</code> elements are expected to be collapsed to
+ zero.</p>
- <p>The <code>table</code> element's <code
- title="attr-table-cellpadding">cellpadding</code> attribute <span
- title="maps to the pixel length property">maps to the pixel length
- properties</span> 'padding-top', 'padding-right', 'padding-bottom',
- and 'padding-left' of any <code>td</code> and <code>th</code>
- elements that have corresponding <span
- title="concept-cell">cells</span> in the <span
- title="concept-table">table</span> corresponding to the
- <code>table</code> element.</p>
+ <hr>
- <p>The <code>table</code> element's <code
- title="attr-table-hspace">hspace</code> attribute <span title="maps
- to the dimension property">maps to the dimension properties</span>
- 'margin-left' and 'margin-right' on the <code>table</code>
- element.</p>
+ <p>When a <code>body</code> element has a <code
+ title="attr-background">background</code> attribute set to a
+ non-empty value, the new value is expected to be <span
+ title="resolve a url">resolved</span> relative to the element, and
+ if this is successful, the user agent is expected to treat the
+ attribute as a <span title="presentational hints">presentational
+ hint</span> setting the element's 'background-image' property to the
+ resulting <span>absolute URL</span>.</p>
- <p>The <code>table</code> element's <code
- title="attr-table-vspace">vspace</code> attribute <span title="maps
- to the dimension property">maps to the dimension properties</span>
- 'margin-top' and 'margin-bottom' on the <code>table</code>
- element.</p>
+ <p>When a <code>body</code> element has a <code
+ title="">bgcolor</code> attribute set, the new value is expected to
+ be parsed using the <span>rules for parsing a legacy color
+ value</span>, and if that does not return an error, the user agent
+ is expected to treat the attribute as a <span title="presentational
+ hints">presentational hint</span> setting the element's
+ 'background-color' property to the resulting color.</p>
- <p>The <code>table</code> element's <code
- title="attr-table-height">height</code> attribute <span>maps to the
- dimension property</span> 'height' on the <code>table</code>
- element.</p>
+ <p>When a <code>body</code> element has a <code
+ title="attr-body-text">text</code> attribute, its value is expected
+ to be parsed using the <span>rules for parsing a legacy color
+ value</span>, and if that does not return an error, the user
+ agent is expected to treat the attribute as a <span
+ title="presentational hints">presentational hint</span> setting the
+ element's 'color' property to the resulting color.</p>
- <p>The <code>table</code> element's <code
- title="attr-table-width">width</code> attribute <span>maps to the
- dimension property</span> 'width' on the <code>table</code>
- element.</p>
+ <p>When a <code>body</code> element has a <code
+ title="attr-body-link">link</code> attribute, its value is expected
+ to be parsed using the <span>rules for parsing a legacy color
+ value</span>, and if that does not return an error, the user agent
+ is expected to treat the attribute as a <span title="presentational
+ hints">presentational hint</span> setting the 'color' property of
+ any element in the <code>Document</code> matching the ':link'
+ pseudo-class to the resulting color.</p>
- <p>The <code>col</code> element's <code
- title="attr-col-width">width</code> attribute <span>maps to the
- dimension property</span> 'width' on the <code>col</code>
- element.</p>
+ <p>When a <code>body</code> element has a <code
+ title="attr-body-vlink">vlink</code> attribute, its value is
+ expected to be parsed using the <span>rules for parsing a legacy
+ color value</span>, and if that does not return an error, the user
+ agent is expected to treat the attribute as a <span
+ title="presentational hints">presentational hint</span> setting the
+ 'color' property of any element in the <code>Document</code>
+ matching the ':visited' pseudo-class to the resulting color.</p>
- <p>The <code>tr</code> element's <code
- title="attr-tr-height">height</code> attribute <span>maps to the
- dimension property</span> 'height' on the <code>tr</code>
- element.</p>
+ <p>When a <code>body</code> element has a <code
+ title="attr-body-alink">alink</code> attribute, its value is
+ expected to be parsed using the <span>rules for parsing a legacy
+ color value</span>, and if that does not return an error, the user
+ agent is expected to treat the attribute as a <span
+ title="presentational hints">presentational hint</span> setting the
+ 'color' property of any element in the <code>Document</code>
+ matching the ':active' pseudo-class and either the ':link'
+ pseudo-class or the ':visited' pseudo-class to the resulting
+ color.</p>
- <p>The <code>td</code> and <code>th</code> elements' <code
- title="attr-tdth-height">height</code> attributes <span title="maps
- to the dimension property">map to the dimension property</span> 'height'
- on the element.</p>
- <p>The <code>td</code> and <code>th</code> elements' <code
- title="attr-tdth-width">width</code> attributes <span title="maps
- to the dimension property">map to the dimension property</span> 'width'
- on the element.</p>
- <hr>
+ <h4>Flow content</h4>
- <p>In <span>quirks mode</span>, the following rules are also
- expected to apply:</p>
+ <!-- del, ins, and map are inline. -->
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-form { margin-bottom: 1em; }</pre>
+address, blockquote, center, div, figure, figcaption, footer, form,
+header, hr, legend, listing, p, plaintext, pre, summary, xmp {
+ display: block; unicode-bidi: isolate;
+}
- <p>When a <code>Document</code> is in <span>quirks mode</span>,
- vertical margins on <span>HTML elements</span> at the top or bottom
- of <code>body</code>, <code>td</code>, or <code>th</code> elements
- are expected to be collapsed to zero.</p>
+blockquote, figure, listing, p, plaintext, pre, xmp {
+ margin-top: 1em; margin-bottom: 1em;
+}
- </div>
+blockquote, figure { margin-left: 40px; margin-right: 40px; }
+address { font-style: italic; }
+listing, plaintext, pre, xmp {
+ font-family: monospace; white-space: pre;
+}</pre>
- <div class="impl">
+ <p>The following rules are also expected to apply, as
+ <span>presentational hints</span>:</p>
- <h4>Alignment</h4>
-
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-thead, tbody, tfoot, table > tr { vertical-align: middle; }
-tr, td, th { vertical-align: inherit; }
-sub { vertical-align: sub; }
-sup { vertical-align: super; }</pre>
+pre[wrap] { white-space: pre-wrap; }</pre>
- <hr>
+ <p>In <span>quirks mode</span>, the following rules are also
+ expected to apply:</p>
- <p>The following rules are also expected to apply, as
- <span>presentational hints</span>:</p>
-
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-table[align=left] { float: left; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-table[align=right] { float: right; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-table[align=center], table[align=abscenter],
-table[align=absmiddle], table[align=middle] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- margin-left: auto; margin-right: auto;
-}
-thead[align=absmiddle], tbody[align=absmiddle], tfoot[align=absmiddle],
-tr[align=absmiddle], td[align=absmiddle], th[align=absmiddle] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- text-align: center;
-}
+form { margin-bottom: 1em; }</pre>
-caption[align=bottom] { caption-side: bottom; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-p[align=left], h1[align=left], h2[align=left], h3[align=left],
-h4[align=left], h5[align=left], h6[align=left] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- text-align: left;
-}
-p[align=right], h1[align=right], h2[align=right], h3[align=right],
-h4[align=right], h5[align=right], h6[align=right] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- text-align: right;
-}
-p[align=center], h1[align=center], h2[align=center], h3[align=center],
-h4[align=center], h5[align=center], h6[align=center] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- text-align: center;
-}
-p[align=justify], h1[align=justify], h2[align=justify], h3[align=justify],
-h4[align=justify], h5[align=justify], h6[align=justify] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- text-align: justify;
-}
-thead[valign=top], tbody[valign=top], tfoot[valign=top],
-tr[valign=top], td[valign=top], th[valign=top] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- vertical-align: top;
-}
-thead[valign=middle], tbody[valign=middle], tfoot[valign=middle],
-tr[valign=middle], td[valign=middle], th[valign=middle] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- vertical-align: middle;
-}
-thead[valign=bottom], tbody[valign=bottom], tfoot[valign=bottom],
-tr[valign=bottom], td[valign=bottom], th[valign=bottom] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- vertical-align: bottom;
-}
-thead[valign=baseline], tbody[valign=baseline], tfoot[valign=baseline],
-tr[valign=baseline], td[valign=baseline], th[valign=baseline] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- vertical-align: baseline;
-}</pre>
+ <hr>
- <p>The <code>center</code> element, the <code>caption</code> element
- unless specified otherwise below, and the <code>div</code>,
- <code>thead</code>, <code>tbody</code>, <code>tfoot</code>,
- <code>tr</code>, <code>td</code>, and <code>th</code> elements when
- they have an <code title="attr-div-align">align</code> attribute
+ <p>The <code>center</code> element, and the <code>div</code> element
+ when it has an <code title="attr-div-align">align</code> attribute
whose value is an <span>ASCII case-insensitive</span> match for
either the string "<code title="">center</code>" or the string
"<code title="">middle</code>", are expected to center text within
@@ -104497,205 +104353,108 @@
hint</span>, and to <span>align descendants</span> to the
center.</p>
- <p>The <code>div</code>, <code>caption</code>, <code>thead</code>,
- <code>tbody</code>, <code>tfoot</code>, <code>tr</code>,
- <code>td</code>, and <code>th</code> elements, when they have an
- <code title="attr-align">align</code> attribute whose value is an
+ <p>The <code>div</code> element, when it has an <code
+ title="attr-align">align</code> attribute whose value is an
<span>ASCII case-insensitive</span> match for the string "<code
- title="">left</code>", are expected to left-align text within
- themselves, as if they had their 'text-align' property set to 'left'
- in a <span title="presentational hints">presentational hint</span>,
- and to <span>align descendants</span> to the left.</p>
+ title="">left</code>", is expected to left-align text within itself,
+ as if it had its 'text-align' property set to 'left' in a <span
+ title="presentational hints">presentational hint</span>, and to
+ <span>align descendants</span> to the left.</p>
- <p>The <code>div</code>, <code>caption</code>, <code>thead</code>,
- <code>tbody</code>, <code>tfoot</code>, <code>tr</code>,
- <code>td</code>, and <code>th</code> elements, when they have an
- <code title="attr-align">align</code> attribute whose value is an
+ <p>The <code>div</code> element, when it has an <code
+ title="attr-align">align</code> attribute whose value is an
<span>ASCII case-insensitive</span> match for the string "<code
- title="">right</code>", are expected to right-align text within
- themselves, as if they had their 'text-align' property set to
- 'right' in a <span title="presentational hints">presentational
- hint</span>, and to <span>align descendants</span> to the right.</p>
+ title="">right</code>", is expected to right-align text within
+ itself, as if it had its 'text-align' property set to 'right' in a
+ <span title="presentational hints">presentational hint</span>, and
+ to <span>align descendants</span> to the right.</p>
- <p>The <code>div</code>, <code>caption</code>, <code>thead</code>,
- <code>tbody</code>, <code>tfoot</code>, <code>tr</code>,
- <code>td</code>, and <code>th</code> elements, when they have an
- <code title="attr-align">align</code> attribute whose value is an
+ <p>The <code>div</code> element, when it has an <code
+ title="attr-align">align</code> attribute whose value is an
<span>ASCII case-insensitive</span> match for the string "<code
- title="">justify</code>", are expected to full-justify text within
- themselves, as if they had their 'text-align' property set to
- 'justify' in a <span title="presentational hints">presentational
- hint</span>, and to <span>align descendants</span> to the left.</p>
+ title="">justify</code>", is expected to full-justify text within
+ itself, as if it had its 'text-align' property set to 'justify' in a
+ <span title="presentational hints">presentational hint</span>, and
+ to <span>align descendants</span> to the left.</p>
- <p>When a user agent is to <dfn>align descendants</dfn> of a node,
- the user agent is expected to align only those descendants that have
- both their 'margin-left' and 'margin-right' properties computing to
- a value other than 'auto', that are over-constrained and that have
- one of those two margins with a used value forced to a greater
- value, and that do not themselves have an applicable <code
- title="attr-align">align</code> attribute. When multiple elements
- are to <span title="align descendants">align</span> a particular
- descendant, the most deeply nested such element is expected to
- override the others.</p>
- <p>User agents are expected to have a rule in their user agent
- stylesheet that matches <code>th</code> elements that have a parent
- node whose computed value for the 'text-align' property is its
- initial value, whose declaration block consists of just a single
- declaration that sets the 'text-align' property to the value
- 'center'.</p> <!-- q.v. '-moz-center-or-inherit' -->
- </div>
+ <h4>Phrasing content</h4>
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
- <div class="impl">
+cite, dfn, em, i, var { font-style: italic; }
+b, strong { font-weight: bold; }
+code, kbd, samp, tt { font-family: monospace; }
+big { font-size: larger; }
+small { font-size: smaller; }
- <h4>Fonts and colors</h4>
+sub { vertical-align: sub; }
+sup { vertical-align: super; }
+sub, sup { line-height: normal; font-size: smaller; }
- <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+ruby { display: ruby; }
+rt { display: ruby-text; }
-address, cite, dfn, em, i, var { font-style: italic; }
-b, strong, th { font-weight: bold; }
-code, kbd, listing, plaintext, pre, samp, tt, xmp { font-family: monospace; }
-h1 { font-size: 2.00em; font-weight: bold; }
-h2 { font-size: 1.50em; font-weight: bold; }
-h3 { font-size: 1.17em; font-weight: bold; }
-h4 { font-size: 1.00em; font-weight: bold; }
-h5 { font-size: 0.83em; font-weight: bold; }
-h6 { font-size: 0.67em; font-weight: bold; }
-big { font-size: larger; }
-small, sub, sup { font-size: smaller; }
-sub, sup { line-height: normal; }
-
:link { color: blue; }
:visited { color: purple; }
+:link, :visited { text-decoration: underline; }
+
+:focus { outline: auto; }
+
mark { background: yellow; color: black; }
-table, td, th { border-color: gray; }
-thead, tbody, tfoot, tr { border-color: inherit; }
-table[rules=none], table[rules=groups], table[rules=rows],
-table[rules=cols], table[rules=all], table[frame=void],
-table[frame=above], table[frame=below], table[frame=hsides],
-table[frame=lhs], table[frame=rhs], table[frame=vsides],
-table[frame=box], table[frame=border],
-table[rules=none] > tr > td, table[rules=none] > tr > th,
-table[rules=groups] > tr > td, table[rules=groups] > tr > th,
-table[rules=rows] > tr > td, table[rules=rows] > tr > th,
-table[rules=cols] > tr > td, table[rules=cols] > tr > th,
-table[rules=all] > tr > td, table[rules=all] > tr > th,
-table[rules=none] > thead > tr > td, table[rules=none] > thead > tr > th,
-table[rules=groups] > thead > tr > td, table[rules=groups] > thead > tr > th,
-table[rules=rows] > thead > tr > td, table[rules=rows] > thead > tr > th,
-table[rules=cols] > thead > tr > td, table[rules=cols] > thead > tr > th,
-table[rules=all] > thead > tr > td, table[rules=all] > thead > tr > th,
-table[rules=none] > tbody > tr > td, table[rules=none] > tbody > tr > th,
-table[rules=groups] > tbody > tr > td, table[rules=groups] > tbody > tr > th,
-table[rules=rows] > tbody > tr > td, table[rules=rows] > tbody > tr > th,
-table[rules=cols] > tbody > tr > td, table[rules=cols] > tbody > tr > th,
-table[rules=all] > tbody > tr > td, table[rules=all] > tbody > tr > th,
-table[rules=none] > tfoot > tr > td, table[rules=none] > tfoot > tr > th,
-table[rules=groups] > tfoot > tr > td, table[rules=groups] > tfoot > tr > th,
-table[rules=rows] > tfoot > tr > td, table[rules=rows] > tfoot > tr > th,
-table[rules=cols] > tfoot > tr > td, table[rules=cols] > tfoot > tr > th,
-table[rules=all] > tfoot > tr > td, table[rules=all] > tfoot > tr > th { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
- border-color: black;
-}</pre>
+abbr[title], acronym[title] { text-decoration: dotted underline; }<!-- CSS3 http://dev.w3.org/csswg/css3-text/#text-decoration-style -->
+ins, u { text-decoration: underline; }
+del, s, strike { text-decoration: line-through; }
+blink { text-decoration: blink; }
- <hr>
+q::before { content: open-quote; }
+q::after { content: close-quote; }
- <p>The initial value for the 'color' property is expected to be
- black. The initial value for the 'background-color' property is
- expected to be 'transparent'. The canvas' background is expected to
- be white.</p>
+br { content: '\A'; white-space: pre; }
+nobr { white-space: nowrap; }</pre>
- <hr>
+ <p>The following rules are also expected to apply, as
+ <span>presentational hints</span>:</p>
- <p>The <code>article</code>, <code>aside</code>, <code>nav</code>,
- and <code>section</code> elements are expected to affect the font
- size of <code>h1</code> elements, based on the nesting depth. If
- <var title="">x</var> is a selector that matches elements that are
- either <code>article</code>, <code>aside</code>, <code>nav</code>,
- or <code>section</code> elements, then the following rules capture
- what is expected:</p>
-
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-<var title="">x</var> h1 { font-size: 1.50em; }
-<var title="">x</var> <var title="">x</var> h1 { font-size: 1.17em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { font-size: 1.00em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { font-size: 0.83em; }
-<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { font-size: 0.67em; }</pre>
+br[clear=left] { clear: left; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+br[clear=right] { clear: right; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+br[clear=all], br[clear=both] { clear: both; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */</pre>
- <hr>
+ <p>For the purposes of the CSS ruby model, runs of children of
+ <code>ruby</code> elements that are not <code>rt</code> or
+ <code>rp</code> elements are expected to be wrapped in anonymous
+ boxes whose 'display' property has the value 'ruby-base'. <a
+ href="#refsCSSRUBY">[CSSRUBY]</a></p>
- <p>When a <code>body</code>, <code>table</code>, <code>thead</code>,
- <code>tbody</code>, <code>tfoot</code>, <code>tr</code>,
- <code>td</code>, or <code>th</code> element has a <code
- title="attr-background">background</code> attribute set to a
- non-empty value, the new value is expected to be <span
- title="resolve a url">resolved</span> relative to the element, and
- if this is successful, the user agent is expected to treat the
- attribute as a <span title="presentational hints">presentational
- hint</span> setting the element's 'background-image' property to the
- resulting <span>absolute URL</span>.</p>
+ <p>User agents that do not support correct ruby rendering are
+ expected to render parentheses around the text of <code>rt</code>
+ elements in the absence of <code>rp</code> elements.</p>
- <p>When a <code>body</code>, <code>table</code>, <code>thead</code>,
- <code>tbody</code>, <code>tfoot</code>, <code>tr</code>,
- <code>td</code>, or <code>th</code> element has a <code
- title="">bgcolor</code> attribute set, the new value is expected to
- be parsed using the <span>rules for parsing a legacy color
- value</span>, and if that does not return an error, the user agent
- is expected to treat the attribute as a <span title="presentational
- hints">presentational hint</span> setting the element's
- 'background-color' property to the resulting color.</p>
+ <p>Rules setting the 'quotes' property appropriately for the locales
+ and languages understood by the user are expected to be present.</p>
- <p>When a <code>body</code> element has a <code
- title="attr-body-text">text</code> attribute, its value is expected
- to be parsed using the <span>rules for parsing a legacy color
- value</span>, and if that does not return an error, the user
- agent is expected to treat the attribute as a <span
- title="presentational hints">presentational hint</span> setting the
- element's 'color' property to the resulting color.</p>
+ <hr>
- <p>When a <code>body</code> element has a <code
- title="attr-body-link">link</code> attribute, its value is expected
- to be parsed using the <span>rules for parsing a legacy color
- value</span>, and if that does not return an error, the user agent
- is expected to treat the attribute as a <span title="presentational
- hints">presentational hint</span> setting the 'color' property of
- any element in the <code>Document</code> matching the ':link'
- pseudo-class to the resulting color.</p>
+ <p>User agents are expected to
+ support the 'clear' property on inline elements (in order to render
+ <code>br</code> elements with <code
+ title="attr-br-clear">clear</code> attributes) in the manner
+ described in the non-normative note to this effect in CSS2.1.</p>
+ <!-- section 9.5.2 of CSS2.1 -->
- <p>When a <code>body</code> element has a <code
- title="attr-body-vlink">vlink</code> attribute, its value is
- expected to be parsed using the <span>rules for parsing a legacy
- color value</span>, and if that does not return an error, the user
- agent is expected to treat the attribute as a <span
- title="presentational hints">presentational hint</span> setting the
- 'color' property of any element in the <code>Document</code>
- matching the ':visited' pseudo-class to the resulting color.</p>
+ <p>The <code>wbr</code> element is expected to override the
+ 'white-space' property and always provide a line-breaking
+ opportunity.</p>
- <p>When a <code>body</code> element has a <code
- title="attr-body-alink">alink</code> attribute, its value is
- expected to be parsed using the <span>rules for parsing a legacy
- color value</span>, and if that does not return an error, the user
- agent is expected to treat the attribute as a <span
- title="presentational hints">presentational hint</span> setting the
- 'color' property of any element in the <code>Document</code>
- matching the ':active' pseudo-class and either the ':link'
- pseudo-class or the ':visited' pseudo-class to the resulting
- color.</p>
+ <p>The initial value for the 'color' property is expected to be
+ black. The initial value for the 'background-color' property is
+ expected to be 'transparent'. The canvas' background is expected to
+ be white.</p>
- <p>When a <code>table</code> element has a <code
- title="attr-table-bordercolor">bordercolor</code> attribute, its
- value is expected to be parsed using the <span>rules for parsing a
- legacy color value</span>, and if that does not return an error, the
- user agent is expected to treat the attribute as a <span
- title="presentational hints">presentational hint</span> setting the
- element's 'border-top-color', 'border-right-color',
- 'border-bottom-color', and 'border-right-color' properties to the
- resulting color.</p>
-
<hr>
<p>When a <code>font</code> element has a <code
@@ -104835,37 +104594,77 @@
</ol>
- </div>
+ <h4>Bidirectional text</h4>
- <div class="impl">
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
- <h4>Punctuation and decorations</h4>
+:ltr { direction: ltr; }
+:rtl { direction: rtl; }
+[dir] { unicode-bidi: embed; }
+bdi, output, [dir=auto] { unicode-bidi: isolate; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+bdo, bdo[dir] { unicode-bidi: bidi-override; }
+bdo[dir=auto] { unicode-bidi: bidi-override isolate; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+textarea[dir=auto], pre[dir=auto] { unicode-bidi: plaintext; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */</pre>
+
+ <h4>Sections and headings</h4>
+
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-:link, :visited, ins, u { text-decoration: underline; }
-abbr[title], acronym[title] { text-decoration: dotted underline; }<!-- CSS3 http://dev.w3.org/csswg/css3-text/#text-decoration-style -->
-del, s, strike { text-decoration: line-through; }
-blink { text-decoration: blink; }
+article, aside, h1, h2, h3, h4, h5, h6, hgroup, nav, section {
+ display: block; unicode-bidi: isolate;
+}
-:focus { outline: auto; }
+h1 { margin-top: 0.67em; margin-bottom: 0.67em; font-size: 2.00em; font-weight: bold; }
+h2 { margin-top: 0.83em; margin-bottom: 0.83em; font-size: 1.50em; font-weight: bold; }
+h3 { margin-top: 1.00em; margin-bottom: 1.00em; font-size: 1.17em; font-weight: bold; }
+h4 { margin-top: 1.33em; margin-bottom: 1.33em; font-size: 1.00em; font-weight: bold; }
+h5 { margin-top: 1.67em; margin-bottom: 1.67em; font-size: 0.83em; font-weight: bold; }
+h6 { margin-top: 2.33em; margin-bottom: 2.33em; font-size: 0.67em; font-weight: bold; }</pre>
-q:before { content: open-quote; }
-q:after { content: close-quote; }
+ <p>The <code>article</code>, <code>aside</code>, <code>nav</code>,
+ and <code>section</code> elements are expected to affect the margins
+ and font size of <code>h1</code> elements, based on the nesting
+ depth. If <var title="">x</var> is a selector that matches elements
+ that are either <code>article</code>, <code>aside</code>,
+ <code>nav</code>, or <code>section</code> elements, then the
+ following rules capture what is expected:</p>
-br { content: '\A'; white-space: pre; }
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-nobr { white-space: nowrap; }
-listing, plaintext, pre, xmp { white-space: pre; }
-textarea { white-space: pre-wrap; }
+<var title="">x</var> h1 { margin-top: 0.83em; margin-bottom: 0.83em; font-size: 1.50em; }
+<var title="">x</var> <var title="">x</var> h1 { margin-top: 1.00em; margin-bottom: 1.00em; font-size: 1.17em; }
+<var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.33em; margin-bottom: 1.33em; font-size: 1.00em; }
+<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 1.67em; margin-bottom: 1.67em; font-size: 0.83em; }
+<var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> <var title="">x</var> h1 { margin-top: 2.33em; margin-bottom: 2.33em; font-size: 0.67em; }</pre>
-ol { list-style-type: decimal; }
-dir, menu, ul {
- list-style-type: disc;
+
+ <h4>Lists</h4>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+
+dir, dd, dl, dt, menu, ol, ul { display: block; unicode-bidi: isolate; }
+li { display: list-item; unicode-bidi: isolate; }
+
+dir, dl, menu, ol, ul { margin-top: 1em; margin-bottom: 1em; }
+
+dir dir, dir dl, dir menu, dir ol, dir ul,
+dl dir, dl dl, dl menu, dl ol, dl ul,
+menu dir, menu dl, menu menu, menu ol, menu ul,
+ol dir, ol dl, ol menu, ol ol, ol ul,
+ul dir, ul dl, ul menu, ul ol, ul ul {
+ margin-top: 0; margin-bottom: 0;
}
+dd { margin-left: 40px; } /* <span>LTR-specific</span>: use 'margin-right' for rtl elements */
+dir, menu, ol, ul { padding-left: 40px; } /* <span>LTR-specific</span>: use 'padding-right' for rtl elements */
+
+ol { list-style-type: decimal; }
+
+dir, menu, ul { list-style-type: disc; }
+
dir dl, dir menu, dir ul,
menu dl, menu menu, menu ul,
ol dl, ol menu, ol ul,
@@ -104890,43 +104689,13 @@
ul ol dl, ul ol menu, ul ol ul,
ul ul dl, ul ul menu, ul ul ul {
list-style-type: square;
-}
+}</pre>
-table { border-style: outset; }
-td, th { border-style: inset; }
-
-:ltr { direction: ltr; }
-:rtl { direction: rtl; }
-[dir] { unicode-bidi: embed; }
-bdi, output, [dir=auto] { unicode-bidi: isolate; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-bdo, bdo[dir] { unicode-bidi: bidi-override; }
-bdo[dir=auto] { unicode-bidi: bidi-override isolate; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-textarea[dir=auto], pre[dir=auto] { unicode-bidi: plaintext; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */</pre>
-
- <p>Rules setting the 'quotes' property appropriately for the locales
- and languages understood by the user are expected to be present.</p>
-
- <p>User agents are expected to
- support the 'clear' property on inline elements (in order to render
- <code>br</code> elements with <code
- title="attr-br-clear">clear</code> attributes) in the manner
- described in the non-normative note to this effect in CSS2.1.</p>
- <!-- section 9.5.2 of CSS2.1 -->
-
- <hr>
-
- <p id="decohints">The following rules are also expected to apply, as
+ <p>The following rules are also expected to apply, as
<span>presentational hints</span>:</p>
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-td[nowrap], th[nowrap] { white-space: nowrap; }
-pre[wrap] { white-space: pre-wrap; }
-
-br[clear=left] { clear: left; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-br[clear=right] { clear: right; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-br[clear=all], br[clear=both] { clear: both; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-
ol[type=1], li[type=1] { list-style-type: decimal; }
ol[type=a], li[type=a] { list-style-type: lower-alpha; }<!-- /* <a href="#case-sensitive-selector-exception">case-sensitive</a> */ -->
ol[type=A], li[type=A] { list-style-type: upper-alpha; }<!-- /* <a href="#case-sensitive-selector-exception">case-sensitive</a> */ -->
@@ -104934,9 +104703,128 @@
ol[type=I], li[type=I] { list-style-type: upper-roman; }<!-- /* <a href="#case-sensitive-selector-exception">case-sensitive</a> */ -->
ul[type=disc], li[type=disc] { list-style-type: disc; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
ul[type=circle], li[type=circle] { list-style-type: circle; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
-ul[type=square], li[type=square] { list-style-type: square; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ul[type=square], li[type=square] { list-style-type: square; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */</pre>
+ <p>When rendering <code>li</code> elements, user agents are expected
+ to use the <span>ordinal value</span> of the <code>li</code> element
+ to render the counter in the list item marker.</p>
+
+
+ <h4>Tables</h4>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+
+table { display: table; unicode-bidi: isolate; }
+caption { display: table-caption; unicode-bidi: isolate; }
+colgroup, colgroup[hidden] { display: table-column-group; unicode-bidi: isolate; }
+col, col[hidden] { display: table-column; unicode-bidi: isolate; }
+thead, thead[hidden] { display: table-header-group; unicode-bidi: isolate; }
+tbody, tbody[hidden] { display: table-row-group; unicode-bidi: isolate; }
+tfoot, tfoot[hidden] { display: table-footer-group; unicode-bidi: isolate; }
+tr, tr[hidden] { display: table-row; unicode-bidi: isolate; }
+td, th, td[hidden], th[hidden] { display: table-cell; unicode-bidi: isolate; }
+
+colgroup[hidden], col[hidden], thead[hidden], tbody[hidden],
+tfoot[hidden], tr[hidden], td[hidden], th[hidden] {
+ visibility: collapse;
+}
+
+table {
+ border-spacing: 2px;
+ border-collapse: separate;
+ border-style: outset;
+ text-indent: initial;
+}
+
+td, th { padding: 1px; border-style: inset; }
+th { font-weight: bold; }
+
+thead, tbody, tfoot, table > tr { vertical-align: middle; }
+tr, td, th { vertical-align: inherit; }
+
+table, td, th { border-color: gray; }
+thead, tbody, tfoot, tr { border-color: inherit; }
table[rules=none], table[rules=groups], table[rules=rows],
+table[rules=cols], table[rules=all], table[frame=void],
+table[frame=above], table[frame=below], table[frame=hsides],
+table[frame=lhs], table[frame=rhs], table[frame=vsides],
+table[frame=box], table[frame=border],
+table[rules=none] > tr > td, table[rules=none] > tr > th,
+table[rules=groups] > tr > td, table[rules=groups] > tr > th,
+table[rules=rows] > tr > td, table[rules=rows] > tr > th,
+table[rules=cols] > tr > td, table[rules=cols] > tr > th,
+table[rules=all] > tr > td, table[rules=all] > tr > th,
+table[rules=none] > thead > tr > td, table[rules=none] > thead > tr > th,
+table[rules=groups] > thead > tr > td, table[rules=groups] > thead > tr > th,
+table[rules=rows] > thead > tr > td, table[rules=rows] > thead > tr > th,
+table[rules=cols] > thead > tr > td, table[rules=cols] > thead > tr > th,
+table[rules=all] > thead > tr > td, table[rules=all] > thead > tr > th,
+table[rules=none] > tbody > tr > td, table[rules=none] > tbody > tr > th,
+table[rules=groups] > tbody > tr > td, table[rules=groups] > tbody > tr > th,
+table[rules=rows] > tbody > tr > td, table[rules=rows] > tbody > tr > th,
+table[rules=cols] > tbody > tr > td, table[rules=cols] > tbody > tr > th,
+table[rules=all] > tbody > tr > td, table[rules=all] > tbody > tr > th,
+table[rules=none] > tfoot > tr > td, table[rules=none] > tfoot > tr > th,
+table[rules=groups] > tfoot > tr > td, table[rules=groups] > tfoot > tr > th,
+table[rules=rows] > tfoot > tr > td, table[rules=rows] > tfoot > tr > th,
+table[rules=cols] > tfoot > tr > td, table[rules=cols] > tfoot > tr > th,
+table[rules=all] > tfoot > tr > td, table[rules=all] > tfoot > tr > th { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ border-color: black;
+}</pre>
+
+ <p>The following rules are also expected to apply, as
+ <span>presentational hints</span>:</p>
+
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+
+table[align=left] { float: left; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+table[align=right] { float: right; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+table[align=center], table[align=abscenter],
+table[align=absmiddle], table[align=middle] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ margin-left: auto; margin-right: auto;
+}
+thead[align=absmiddle], tbody[align=absmiddle], tfoot[align=absmiddle],
+tr[align=absmiddle], td[align=absmiddle], th[align=absmiddle] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ text-align: center;
+}
+
+caption[align=bottom] { caption-side: bottom; } /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+p[align=left], h1[align=left], h2[align=left], h3[align=left],
+h4[align=left], h5[align=left], h6[align=left] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ text-align: left;
+}
+p[align=right], h1[align=right], h2[align=right], h3[align=right],
+h4[align=right], h5[align=right], h6[align=right] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ text-align: right;
+}
+p[align=center], h1[align=center], h2[align=center], h3[align=center],
+h4[align=center], h5[align=center], h6[align=center] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ text-align: center;
+}
+p[align=justify], h1[align=justify], h2[align=justify], h3[align=justify],
+h4[align=justify], h5[align=justify], h6[align=justify] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ text-align: justify;
+}
+thead[valign=top], tbody[valign=top], tfoot[valign=top],
+tr[valign=top], td[valign=top], th[valign=top] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ vertical-align: top;
+}
+thead[valign=middle], tbody[valign=middle], tfoot[valign=middle],
+tr[valign=middle], td[valign=middle], th[valign=middle] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ vertical-align: middle;
+}
+thead[valign=bottom], tbody[valign=bottom], tfoot[valign=bottom],
+tr[valign=bottom], td[valign=bottom], th[valign=bottom] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ vertical-align: bottom;
+}
+thead[valign=baseline], tbody[valign=baseline], tfoot[valign=baseline],
+tr[valign=baseline], td[valign=baseline], th[valign=baseline] { /* <a href="#case-insensitive-selector-exception">case-insensitive</a> */
+ vertical-align: baseline;
+}
+
+td[nowrap], th[nowrap] { white-space: nowrap; }
+
+table[rules=none], table[rules=groups], table[rules=rows],
table[rules=cols], table[rules=all] {
border-style: none;
border-collapse: collapse;
@@ -104998,11 +104886,202 @@
border-width: 1px;
}</pre>
- <p>When rendering <code>li</code> elements, user agents are expected
- to use the <span>ordinal value</span> of the <code>li</code> element
- to render the counter in the list item marker.</p>
+ <p>In <span>quirks mode</span>, the following rules are also
+ expected to apply:</p>
+ <pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
+
+table {
+ font-weight: initial;
+ font-style: initial;
+ font-variant: initial;
+ font-size: initial;
+ line-height: initial;
+ white-space: initial;
+ text-align: initial;
+}</pre>
+
+ <hr>
+
+ <p>For the purposes of the CSS table model, the <code>col</code>
+ element is expected to be treated as if it was present as many times
+ as its <code title="attr-col-span">span</code> attribute <span
+ title="rules for parsing non-negative
+ integers">specifies</span>.</p>
+
+ <p>For the purposes of the CSS table model, the
+ <code>colgroup</code> element, if it contains no <code>col</code>
+ element, is expected to be treated as if it had as many such
+ children as its <code title="attr-colgroup-span">span</code>
+ attribute <span title="rules for parsing non-negative
+ integers">specifies</span>.</p>
+
+ <p>For the purposes of the CSS table model, the <code
+ title="attr-tdth-colspan">colspan</code> and <code
+ title="attr-tdth-rowspan">rowspan</code> attributes on
+ <code>td</code> and <code>th</code> elements are expected to <span
+ title="rules for parsing non-negative integers">provide</span> the
+ <i>special knowledge</i> regarding cells spanning rows and
+ columns.</p>
+
+ <p>In <span>HTML documents</span>, the user agent is expected to
+ hide <code>form</code> elements that are children of
+ <code>table</code>, <code>thead</code>, <code>tbody</code>,
+ <code>tfoot</code>, or <code>tr</code> elements, irrespective of CSS
+ rules.</p>
+
+ <hr>
+
<p>The <code>table</code> element's <code
+ title="attr-table-cellspacing">cellspacing</code> attribute
+ <span>maps to the pixel length property</span> 'border-spacing' on the
+ element.</p>
+
+ <p>The <code>table</code> element's <code
+ title="attr-table-cellpadding">cellpadding</code> attribute <span
+ title="maps to the pixel length property">maps to the pixel length
+ properties</span> 'padding-top', 'padding-right', 'padding-bottom',
+ and 'padding-left' of any <code>td</code> and <code>th</code>
+ elements that have corresponding <span
+ title="concept-cell">cells</span> in the <span
+ title="concept-table">table</span> corresponding to the
+ <code>table</code> element.</p>
+
+ <p>The <code>table</code> element's <code
+ title="attr-table-hspace">hspace</code> attribute <span title="maps
+ to the dimension property">maps to the dimension properties</span>
+ 'margin-left' and 'margin-right' on the <code>table</code>
+ element.</p>
+
+ <p>The <code>table</code> element's <code
+ title="attr-table-vspace">vspace</code> attribute <span title="maps
+ to the dimension property">maps to the dimension properties</span>
+ 'margin-top' and 'margin-bottom' on the <code>table</code>
+ element.</p>
+
+ <p>The <code>table</code> element's <code
+ title="attr-table-height">height</code> attribute <span>maps to the
+ dimension property</span> 'height' on the <code>table</code>
+ element.</p>
+
+ <p>The <code>table</code> element's <code
+ title="attr-table-width">width</code> attribute <span>maps to the
+ dimension property</span> 'width' on the <code>table</code>
+ element.</p>
+
+ <p>The <code>col</code> element's <code
+ title="attr-col-width">width</code> attribute <span>maps to the
+ dimension property</span> 'width' on the <code>col</code>
+ element.</p>
+
+ <p>The <code>tr</code> element's <code
+ title="attr-tr-height">height</code> attribute <span>maps to the
+ dimension property</span> 'height' on the <code>tr</code>
+ element.</p>
+
+ <p>The <code>td</code> and <code>th</code> elements' <code
+ title="attr-tdth-height">height</code> attributes <span title="maps
+ to the dimension property">map to the dimension property</span> 'height'
+ on the element.</p>
+
+ <p>The <code>td</code> and <code>th</code> elements' <code
+ title="attr-tdth-width">width</code> attributes <span title="maps
+ to the dimension property">map to the dimension property</span> 'width'
+ on the element.</p>
+
+ <p>When a <code>Document</code> is in <span>quirks mode</span>,
+ vertical margins on <span>HTML elements</span> at the top or bottom
+ of <code>td</code> or <code>th</code> elements are expected to be
+ collapsed to zero.</p>
+
+ <hr>
+
+ <p>The the <code>caption</code> element unless specified otherwise
+ below, and the <code>thead</code>, <code>tbody</code>,
+ <code>tfoot</code>, <code>tr</code>, <code>td</code>, and
+ <code>th</code> elements when they have an <code
+ title="attr-div-align">align</code> attribute whose value is an
+ <span>ASCII case-insensitive</span> match for either the string
+ "<code title="">center</code>" or the string "<code
+ title="">middle</code>", are expected to center text within
+ themselves, as if they had their 'text-align' property set to
+ 'center' in a <span title="presentational hints">presentational
+ hint</span>, and to <span>align descendants</span> to the
+ center.</p>
+
+ <p>The <code>caption</code>, <code>thead</code>, <code>tbody</code>,
+ <code>tfoot</code>, <code>tr</code>, <code>td</code>, and
+ <code>th</code> elements, when they have an <code
+ title="attr-align">align</code> attribute whose value is an
+ <span>ASCII case-insensitive</span> match for the string "<code
+ title="">left</code>", are expected to left-align text within
+ themselves, as if they had their 'text-align' property set to 'left'
+ in a <span title="presentational hints">presentational hint</span>,
+ and to <span>align descendants</span> to the left.</p>
+
+ <p>The <code>caption</code>, <code>thead</code>, <code>tbody</code>,
+ <code>tfoot</code>, <code>tr</code>, <code>td</code>, and
+ <code>th</code> elements, when they have an <code
+ title="attr-align">align</code> attribute whose value is an
+ <span>ASCII case-insensitive</span> match for the string "<code
+ title="">right</code>", are expected to right-align text within
+ themselves, as if they had their 'text-align' property set to
+ 'right' in a <span title="presentational hints">presentational
+ hint</span>, and to <span>align descendants</span> to the right.</p>
+
+ <p>The <code>caption</code>, <code>thead</code>, <code>tbody</code>,
+ <code>tfoot</code>, <code>tr</code>, <code>td</code>, and
+ <code>th</code> elements, when they have an <code
+ title="attr-align">align</code> attribute whose value is an
+ <span>ASCII case-insensitive</span> match for the string "<code
+ title="">justify</code>", are expected to full-justify text within
+ themselves, as if they had their 'text-align' property set to
+ 'justify' in a <span title="presentational hints">presentational
+ hint</span>, and to <span>align descendants</span> to the left.</p>
+
+ <p>User agents are expected to have a rule in their user agent
+ stylesheet that matches <code>th</code> elements that have a parent
+ node whose computed value for the 'text-align' property is its
+ initial value, whose declaration block consists of just a single
+ declaration that sets the 'text-align' property to the value
+ 'center'.</p> <!-- q.v. '-moz-center-or-inherit' -->
+
+ <hr>
+
+ <p>When a <code>table</code>, <code>thead</code>,
+ <code>tbody</code>, <code>tfoot</code>, <code>tr</code>,
+ <code>td</code>, or <code>th</code> element has a <code
+ title="attr-background">background</code> attribute set to a
+ non-empty value, the new value is expected to be <span
+ title="resolve a url">resolved</span> relative to the element, and
+ if this is successful, the user agent is expected to treat the
+ attribute as a <span title="presentational hints">presentational
+ hint</span> setting the element's 'background-image' property to the
+ resulting <span>absolute URL</span>.</p>
+
+ <p>When a <code>table</code>, <code>thead</code>,
+ <code>tbody</code>, <code>tfoot</code>, <code>tr</code>,
+ <code>td</code>, or <code>th</code> element has a <code
+ title="">bgcolor</code> attribute set, the new value is expected to
+ be parsed using the <span>rules for parsing a legacy color
+ value</span>, and if that does not return an error, the user agent
+ is expected to treat the attribute as a <span title="presentational
+ hints">presentational hint</span> setting the element's
+ 'background-color' property to the resulting color.</p>
+
+ <p>When a <code>table</code> element has a <code
+ title="attr-table-bordercolor">bordercolor</code> attribute, its
+ value is expected to be parsed using the <span>rules for parsing a
+ legacy color value</span>, and if that does not return an error, the
+ user agent is expected to treat the attribute as a <span
+ title="presentational hints">presentational hint</span> setting the
+ element's 'border-top-color', 'border-right-color',
+ 'border-bottom-color', and 'border-right-color' properties to the
+ resulting color.</p>
+
+ <hr>
+
+ <p>The <code>table</code> element's <code
title="attr-table-border">border</code> attribute <span title="maps
to the pixel length property">maps to the pixel length
properties</span> 'border-top-width', 'border-right-width',
@@ -105024,51 +105103,31 @@
<span>table model</span> as the <code>table</code> element to
zero.</p>
- <p>The <code>wbr</code> element is expected to override the
- 'white-space' property and always provide a line-breaking
- opportunity.</p>
- </div>
+ <h4>Form controls</h4>
- <div class="impl">
-
- <h4>Resetting rules for inherited properties</h4>
-
- <p>The following rules are also expected to be in play, resetting
- certain properties to block inheritance by default.</p>
-
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-table, input, select, option, optgroup, button, textarea, keygen {
+input, select, option, optgroup, button, textarea, keygen {
text-indent: initial;
-}</pre>
+}
- <!-- arguably, the form controls' 'text-indent' lines should be in
- the sections below instead of here, but that would be far more
- complicated than this -->
+textarea { white-space: pre-wrap; }
+</pre>
<p>In <span>quirks mode</span>, the following rules are also
expected to apply:</p>
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
-table {
- font-weight: initial;
- font-style: initial;
- font-variant: initial;
- font-size: initial;
- line-height: initial;
- white-space: initial;
- text-align: initial;
-}
-
input { box-sizing: border-box; }</pre>
- </div>
+ <p>Each kind of form control is also given a specific default
+ binding, as described in subsequent sections, which implements the
+ look and feel of the control.</p>
- <div class="impl">
<h4>The <code>hr</code> element</h4>
@@ -105123,11 +105182,8 @@
hints">presentational hint</span> setting the element's 'color'
property to the resulting color.</p>
- </div>
- <div class="impl">
-
<h4>The <code>fieldset</code> element</h4>
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);
@@ -105188,11 +105244,7 @@
<td>In the middle
</table>
- </div>
-
- <div class="impl">
-
<h3>Replaced elements</h3>
<h4>Embedded content</h4>
More information about the Commit-Watchers
mailing list