Skip to content

Commit

Permalink
[] (0) Define the margins of h1 elements in section elements to match…
Browse files Browse the repository at this point in the history 
… h2-h6, like with the font-size. (credit: sp)

git-svn-id: http://svn.whatwg.org/webapps@3032 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
@Hixie
Hixie committed Apr 29, 2009
1 parent da226cd commit 0ed6556
Show file tree
Hide file tree
Showing 2 changed files with 46 additions and 16 deletions.
30 changes: 22 additions & 8 deletions index
View file
Expand Up @@ -61782,7 +61782,22 @@ blockquote, figure { margin-left: 40px; margin-right: 40px; }
table { border-spacing: 2px; border-collapse: separate; }
td, th { padding: 1px; }</pre>

<p>For each property in the table below, given a <code><a href=#the-body-element>body</a></code>
<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>
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
Expand Down Expand Up @@ -62102,14 +62117,13 @@ table[frames=border] &gt; tfoot &gt; tr &gt; td, table[frames=border] &gt; tfoot
be white.</p>

<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 styling
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>
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>

<!-- XXX this is better than http://damowmow.com/temp/sectioning.css
but it's still not optimal... -->
<pre class=css>@namespace url(http://www.w3.org/1999/xhtml);

<var title="">x</var> h1 { font-size: 1.50em; }
Expand Down
32 changes: 24 additions & 8 deletions source
View file
Expand Up @@ -72602,6 +72602,24 @@ 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
Expand Down Expand Up @@ -72985,15 +73003,13 @@ table[frames=border] > tfoot > tr > td, table[frames=border] > tfoot > tr > th {
<hr>

<p>The <code>article</code>, <code>aside</code>, <code>nav</code>,
and <code>section</code> elements are expected to affect the styling
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>
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>

<!-- XXX this is better than http://damowmow.com/temp/sectioning.css
but it's still not optimal... -->
<pre class="css">@namespace url(http://www.w3.org/1999/xhtml);

<var title="">x</var> h1 { font-size: 1.50em; }
Expand Down

0 comments on commit 0ed6556

Please sign in to comment.