Skip to content

Commit 5edfc13

Browse files
fantasaifantasai
committed
Use <position> instead of <bg-position> so the name is generic enough to use for other things like 'object-position'
1 parent abb46e0 commit 5edfc13

4 files changed

Lines changed: 58 additions & 54 deletions

File tree

‎css3-background/Overview.html‎

Lines changed: 38 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -22,12 +22,12 @@
2222

2323
<h1>CSS Backgrounds and Borders Module Level 3</h1>
2424

25-
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 08 June 2011</h2>
25+
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 17 August 2011</h2>
2626

2727
<dl>
2828
<dt>This version:
2929

30-
<dd><!-- <a href="http://www.w3.org/TR/2011/CR-css3-background-20110608">http://www.w3.org/TR/2011/ED-css3-background-20110608/</a> -->
30+
<dd><!-- <a href="http://www.w3.org/TR/2011/CR-css3-background-20110817">http://www.w3.org/TR/2011/ED-css3-background-20110817/</a> -->
3131
<a
3232
href="http://dev.w3.org/csswg/css3-background">http://dev.w3.org/csswg/css3-background</a>
3333

@@ -967,8 +967,8 @@ <h3 id=the-background-position><span class=secno>3.6. </span>The &lsquo;<a
967967
<tr>
968968
<th>Value:
969969

970-
<td><a href="#ltbg-positiongt"><var>&lt;bg-position&gt;</var></a> [ , <a
971-
href="#ltbg-positiongt"><var>&lt;bg-position&gt;</var></a> ]*
970+
<td><a href="#ltpositiongt"><var>&lt;position&gt;</var></a> [ , <a
971+
href="#ltpositiongt"><var>&lt;position&gt;</var></a> ]*
972972

973973
<tr>
974974
<th>Initial:
@@ -1012,8 +1012,7 @@ <h3 id=the-background-position><span class=secno>3.6. </span>The &lsquo;<a
10121012

10131013
<p>Where
10141014

1015-
<pre
1016-
class=prod><dfn id=ltbg-positiongt><var>&lt;bg-position&gt;</var></dfn> = [
1015+
<pre class=prod><dfn id=ltpositiongt><var>&lt;position&gt;</var></dfn> = [
10171016
[ top | bottom ]
10181017
|
10191018
[ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> | left | center | right ]
@@ -1665,10 +1664,10 @@ <h3 id=the-background><span class=secno>3.10. </span>The &lsquo;<a
16651664
<p>Where
16661665

16671666
<pre
1668-
class=prod><dfn id=ltbg-layergt><var>&lt;bg-layer&gt;</var></dfn> = <a href="#ltbg-imagegt"><var>&lt;bg-image&gt;</var></a> || <a href="#ltbg-positiongt"><var>&lt;bg-position&gt;</var></a> [ / <a href="#ltbg-sizegt"><var>&lt;bg-size&gt;</var></a> ]? || <a href="#ltrepeat-stylegt"><var>&lt;repeat-style&gt;</var></a> || <a href="#ltattachmentgt"><var>&lt;attachment&gt;</var></a> || <a href="#ltboxgt"><var>&lt;box&gt;</var></a>{1,2} </pre>
1667+
class=prod><dfn id=ltbg-layergt><var>&lt;bg-layer&gt;</var></dfn> = <a href="#ltbg-imagegt"><var>&lt;bg-image&gt;</var></a> || <var>&lt;bg-position&gt;</var> [ / <a href="#ltbg-sizegt"><var>&lt;bg-size&gt;</var></a> ]? || <a href="#ltrepeat-stylegt"><var>&lt;repeat-style&gt;</var></a> || <a href="#ltattachmentgt"><var>&lt;attachment&gt;</var></a> || <a href="#ltboxgt"><var>&lt;box&gt;</var></a>{1,2} </pre>
16691668

16701669
<pre
1671-
class=prod><dfn id=ltfinal-bg-layergt><var>&lt;final-bg-layer&gt;</var></dfn> = <a href="#ltbg-imagegt"><var>&lt;bg-image&gt;</var></a> || <a href="#ltbg-positiongt"><var>&lt;bg-position&gt;</var></a> [ / <a href="#ltbg-sizegt"><var>&lt;bg-size&gt;</var></a> ]? || <a href="#ltrepeat-stylegt"><var>&lt;repeat-style&gt;</var></a> || <a href="#ltattachmentgt"><var>&lt;attachment&gt;</var></a> || <a href="#ltboxgt"><var>&lt;box&gt;</var></a>{1,2} || <var>&lt;'background-color'&gt;</var></pre>
1670+
class=prod><dfn id=ltfinal-bg-layergt><var>&lt;final-bg-layer&gt;</var></dfn> = <a href="#ltbg-imagegt"><var>&lt;bg-image&gt;</var></a> || <var>&lt;bg-position&gt;</var> [ / <a href="#ltbg-sizegt"><var>&lt;bg-size&gt;</var></a> ]? || <a href="#ltrepeat-stylegt"><var>&lt;repeat-style&gt;</var></a> || <a href="#ltattachmentgt"><var>&lt;attachment&gt;</var></a> || <a href="#ltboxgt"><var>&lt;box&gt;</var></a>{1,2} || <var>&lt;'background-color'&gt;</var></pre>
16721671

16731672
<p class=note>Note that a color is permitted in <a
16741673
href="#ltfinal-bg-layergt"><var>&lt;final-bg-layer&gt;</var></a>, but not
@@ -4393,7 +4392,7 @@ <h2 class=no-num id=property-index>Property index</h2>
43934392

43944393
<tbody>
43954394
<tr>
4396-
<td><a class=property href="#background">background</a>
4395+
<th><a class=property href="#background">background</a>
43974396

43984397
<td>[ &lt;bg-layer&gt; , ]* &lt;final-bg-layer&gt;
43994398

@@ -4408,7 +4407,7 @@ <h2 class=no-num id=property-index>Property index</h2>
44084407
<td>visual
44094408

44104409
<tr>
4411-
<td><a class=property
4410+
<th><a class=property
44124411
href="#background-attachment">background-attachment</a>
44134412

44144413
<td>&lt;attachment&gt; [ , &lt;attachment&gt; ]*
@@ -4424,7 +4423,7 @@ <h2 class=no-num id=property-index>Property index</h2>
44244423
<td>visual
44254424

44264425
<tr>
4427-
<td><a class=property href="#background-clip">background-clip</a>
4426+
<th><a class=property href="#background-clip">background-clip</a>
44284427

44294428
<td>&lt;box&gt; [ , &lt;box&gt; ]*
44304429

@@ -4439,7 +4438,7 @@ <h2 class=no-num id=property-index>Property index</h2>
44394438
<td>visual
44404439

44414440
<tr>
4442-
<td><a class=property href="#background-color">background-color</a>
4441+
<th><a class=property href="#background-color">background-color</a>
44434442

44444443
<td>&lt;color&gt;
44454444

@@ -4454,7 +4453,7 @@ <h2 class=no-num id=property-index>Property index</h2>
44544453
<td>visual
44554454

44564455
<tr>
4457-
<td><a class=property href="#background-image">background-image</a>
4456+
<th><a class=property href="#background-image">background-image</a>
44584457

44594458
<td>&lt;bg-image&gt; [ , &lt;bg-image&gt; ]*
44604459

@@ -4469,7 +4468,7 @@ <h2 class=no-num id=property-index>Property index</h2>
44694468
<td>visual
44704469

44714470
<tr>
4472-
<td><a class=property href="#background-origin">background-origin</a>
4471+
<th><a class=property href="#background-origin">background-origin</a>
44734472

44744473
<td>&lt;box&gt; [ , &lt;box&gt; ]*
44754474

@@ -4484,10 +4483,10 @@ <h2 class=no-num id=property-index>Property index</h2>
44844483
<td>visual
44854484

44864485
<tr>
4487-
<td><a class=property
4486+
<th><a class=property
44884487
href="#background-position">background-position</a>
44894488

4490-
<td>&lt;bg-position&gt; [ , &lt;bg-position&gt; ]*
4489+
<td>&lt;position&gt; [ , &lt;position&gt; ]*
44914490

44924491
<td>0% 0%
44934492

@@ -4501,7 +4500,7 @@ <h2 class=no-num id=property-index>Property index</h2>
45014500
<td>visual
45024501

45034502
<tr>
4504-
<td><a class=property href="#background-repeat">background-repeat</a>
4503+
<th><a class=property href="#background-repeat">background-repeat</a>
45054504

45064505
<td>&lt;repeat-style&gt; [ , &lt;repeat-style&gt; ]*
45074506

@@ -4516,7 +4515,7 @@ <h2 class=no-num id=property-index>Property index</h2>
45164515
<td>visual
45174516

45184517
<tr>
4519-
<td><a class=property href="#background-size">background-size</a>
4518+
<th><a class=property href="#background-size">background-size</a>
45204519

45214520
<td>&lt;bg-size&gt; [ , &lt;bg-size&gt; ]*
45224521

@@ -4531,7 +4530,7 @@ <h2 class=no-num id=property-index>Property index</h2>
45314530
<td>visual
45324531

45334532
<tr>
4534-
<td><a class=property href="#border">border</a>
4533+
<th><a class=property href="#border">border</a>
45354534

45364535
<td>&lt;border-width&gt; || &lt;border-style&gt; || &lt;color&gt;
45374536

@@ -4546,7 +4545,7 @@ <h2 class=no-num id=property-index>Property index</h2>
45464545
<td>visual
45474546

45484547
<tr>
4549-
<td><a class=property href="#border-color">border-color</a>
4548+
<th><a class=property href="#border-color">border-color</a>
45504549

45514550
<td>&lt;color&gt;{1,4}
45524551

@@ -4561,7 +4560,7 @@ <h2 class=no-num id=property-index>Property index</h2>
45614560
<td>visual
45624561

45634562
<tr>
4564-
<td><a class=property href="#border-image">border-image</a>
4563+
<th><a class=property href="#border-image">border-image</a>
45654564

45664565
<td>&lt;&lsquo;border-image-source&rsquo;&gt; ||
45674566
&lt;&lsquo;border-image-slice&rsquo;&gt; [ /
@@ -4580,7 +4579,7 @@ <h2 class=no-num id=property-index>Property index</h2>
45804579
<td>visual
45814580

45824581
<tr>
4583-
<td><a class=property
4582+
<th><a class=property
45844583
href="#border-image-outset">border-image-outset</a>
45854584

45864585
<td>[ &lt;length&gt; | &lt;number&gt; ]{1,4}
@@ -4597,7 +4596,7 @@ <h2 class=no-num id=property-index>Property index</h2>
45974596
<td>visual
45984597

45994598
<tr>
4600-
<td><a class=property
4599+
<th><a class=property
46014600
href="#border-image-repeat">border-image-repeat</a>
46024601

46034602
<td>[ stretch | repeat | round | space ]{1,2}
@@ -4614,7 +4613,7 @@ <h2 class=no-num id=property-index>Property index</h2>
46144613
<td>visual
46154614

46164615
<tr>
4617-
<td><a class=property href="#border-image-slice">border-image-slice</a>
4616+
<th><a class=property href="#border-image-slice">border-image-slice</a>
46184617

46194618
<td>[&lt;number&gt; | &lt;percentage&gt;]{1,4} &amp;&amp; fill?
46204619

@@ -4630,7 +4629,7 @@ <h2 class=no-num id=property-index>Property index</h2>
46304629
<td>visual
46314630

46324631
<tr>
4633-
<td><a class=property
4632+
<th><a class=property
46344633
href="#border-image-source">border-image-source</a>
46354634

46364635
<td>none | &lt;image&gt;
@@ -4647,7 +4646,7 @@ <h2 class=no-num id=property-index>Property index</h2>
46474646
<td>visual
46484647

46494648
<tr>
4650-
<td><a class=property href="#border-image-width">border-image-width</a>
4649+
<th><a class=property href="#border-image-width">border-image-width</a>
46514650

46524651
<td>[ &lt;length&gt; | &lt;percentage&gt; | &lt;number&gt; | auto ]{1,4}
46534652

@@ -4663,7 +4662,7 @@ <h2 class=no-num id=property-index>Property index</h2>
46634662
<td>visual
46644663

46654664
<tr>
4666-
<td><a class=property href="#border-radius">border-radius</a>
4665+
<th><a class=property href="#border-radius">border-radius</a>
46674666

46684667
<td>[ &lt;length&gt; | &lt;percentage&gt; ]{1,4} [ / [ &lt;length&gt; |
46694668
&lt;percentage&gt; ]{1,4} ]?
@@ -4680,7 +4679,7 @@ <h2 class=no-num id=property-index>Property index</h2>
46804679
<td>visual
46814680

46824681
<tr>
4683-
<td><a class=property href="#border-style">border-style</a>
4682+
<th><a class=property href="#border-style">border-style</a>
46844683

46854684
<td>&lt;border-style&gt;{1,4}
46864685

@@ -4695,7 +4694,7 @@ <h2 class=no-num id=property-index>Property index</h2>
46954694
<td>visual
46964695

46974696
<tr>
4698-
<td><a class=property href="#border-top">border-top</a>, <a
4697+
<th><a class=property href="#border-top">border-top</a>, <a
46994698
class=property href="#border-right">border-right</a>, <a class=property
47004699
href="#border-bottom">border-bottom</a>, <a class=property
47014700
href="#border-left">border-left</a>
@@ -4713,7 +4712,7 @@ <h2 class=no-num id=property-index>Property index</h2>
47134712
<td>visual
47144713

47154714
<tr>
4716-
<td><a class=property href="#border-top-color">border-top-color </a>, <a
4715+
<th><a class=property href="#border-top-color">border-top-color </a>, <a
47174716
class=property href="#border-right-color">border-right-color</a>, <a
47184717
class=property href="#border-bottom-color">border-bottom-color</a>, <a
47194718
class=property href="#border-left-color">border-left-color</a>
@@ -4731,7 +4730,7 @@ <h2 class=no-num id=property-index>Property index</h2>
47314730
<td>visual
47324731

47334732
<tr>
4734-
<td><a class=property
4733+
<th><a class=property
47354734
href="#border-top-right-radius">border-top-right-radius</a>, <a
47364735
class=property
47374736
href="#border-bottom-right-radius">border-bottom-right-radius</a>, <a
@@ -4754,7 +4753,7 @@ <h2 class=no-num id=property-index>Property index</h2>
47544753
<td>visual
47554754

47564755
<tr>
4757-
<td><a class=property href="#border-top-style">border-top-style</a>, <a
4756+
<th><a class=property href="#border-top-style">border-top-style</a>, <a
47584757
class=property href="#border-right-style">border-right-style</a>, <a
47594758
class=property href="#border-bottom-style">border-bottom-style</a>, <a
47604759
class=property href="#border-left-style">border-left-style</a>
@@ -4772,7 +4771,7 @@ <h2 class=no-num id=property-index>Property index</h2>
47724771
<td>visual
47734772

47744773
<tr>
4775-
<td><a class=property href="#border-top-width">border-top-width</a>, <a
4774+
<th><a class=property href="#border-top-width">border-top-width</a>, <a
47764775
class=property href="#border-right-width">border-right-width</a>, <a
47774776
class=property href="#border-bottom-width">border-bottom-width</a>, <a
47784777
class=property href="#border-left-width">border-left-width</a>
@@ -4790,7 +4789,7 @@ <h2 class=no-num id=property-index>Property index</h2>
47904789
<td>visual
47914790

47924791
<tr>
4793-
<td><a class=property href="#border-width">border-width</a>
4792+
<th><a class=property href="#border-width">border-width</a>
47944793

47954794
<td>&lt;border-width&gt;{1,4}
47964795

@@ -4805,7 +4804,7 @@ <h2 class=no-num id=property-index>Property index</h2>
48054804
<td>visual
48064805

48074806
<tr>
4808-
<td><a class=property
4807+
<th><a class=property
48094808
href="#box-decoration-break">box-decoration-break</a>
48104809

48114810
<td>slice | clone
@@ -4821,7 +4820,7 @@ <h2 class=no-num id=property-index>Property index</h2>
48214820
<td>visual
48224821

48234822
<tr>
4824-
<td><a class=property href="#box-shadow">box-shadow</a>
4823+
<th><a class=property href="#box-shadow">box-shadow</a>
48254824

48264825
<td>none | &lt;shadow&gt; [ , &lt;shadow&gt; ]*
48274826

@@ -4913,10 +4912,6 @@ <h2 class=no-num id=index>Index</h2>
49134912
<li><a href="#ltbg-layergt"><var>&lt;bg-layer&gt;</var></a>, <a
49144913
href="#ltbg-layergt" title="&lt;bg-layer&gt;"><strong>3.10.</strong></a>
49154914

4916-
<li><a href="#ltbg-positiongt"><var>&lt;bg-position&gt;</var></a>, <a
4917-
href="#ltbg-positiongt"
4918-
title="&lt;bg-position&gt;"><strong>3.6.</strong></a>
4919-
49204915
<li><a href="#ltbg-sizegt"><var>&lt;bg-size&gt;</var></a>, <a
49214916
href="#ltbg-sizegt" title="&lt;bg-size&gt;"><strong>3.9.</strong></a>
49224917

@@ -5184,6 +5179,9 @@ <h2 class=no-num id=index>Index</h2>
51845179
value"><strong>3.8.</strong></a>
51855180
</ul>
51865181

5182+
<li><a href="#ltpositiongt"><var>&lt;position&gt;</var></a>, <a
5183+
href="#ltpositiongt" title="&lt;position&gt;"><strong>3.6.</strong></a>
5184+
51875185
<li>renderer, <a href="#renderer" title=renderer><strong>8.2.</strong></a>
51885186

51895187

‎css3-background/Overview.src.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -598,8 +598,8 @@ <h3 id="the-background-position">The 'background-position' property</h3>
598598
<tr>
599599
<th>Value:
600600

601-
<td><var>&lt;bg-position&gt;</var>
602-
[ , <var>&lt;bg-position&gt;</var> ]*
601+
<td><var>&lt;position&gt;</var>
602+
[ , <var>&lt;position&gt;</var> ]*
603603
<tr>
604604
<th>Initial:
605605
<td>0% 0%
@@ -628,7 +628,7 @@ <h3 id="the-background-position">The 'background-position' property</h3>
628628
within their corresponding <span>background positioning area.</span>
629629

630630
<p>Where
631-
<pre class=prod><dfn><var>&lt;bg-position&gt;</var></dfn> = [
631+
<pre class=prod><dfn><var>&lt;position&gt;</var></dfn> = [
632632
[ top | bottom ]
633633
|
634634
[ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> | left | center | right ]

‎css3-images/Overview.html‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,10 @@
1616

1717
<h1>CSS Image Values and Replaced Content Module Level 3</h1>
1818

19-
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 16 August 2011</h2>
19+
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 17 August 2011</h2>
2020

2121
<dl><!--<dt>This version:</dt>
22-
<dd><a href="http://www.w3.org/TR/2011/ED-css3-images-20110816/">http://www.w3.org/TR/2011/ED-css3-images-20110816/</a>-->
22+
<dd><a href="http://www.w3.org/TR/2011/ED-css3-images-20110817/">http://www.w3.org/TR/2011/ED-css3-images-20110817/</a>-->
2323

2424
<dt>Latest version:
2525

@@ -1770,7 +1770,7 @@ <h3 id=object-position><span class=secno>6.5. </span> Positioning Objects:
17701770
<tr>
17711771
<th>Value:
17721772

1773-
<td>&lt;bg-position>
1773+
<td>&lt;position>
17741774

17751775
<tr>
17761776
<th>Initial:
@@ -1805,12 +1805,13 @@ <h3 id=object-position><span class=secno>6.5. </span> Positioning Objects:
18051805

18061806
<p>The &lsquo;<a href="#object-position0"><code
18071807
class=property>object-position</code></a>&rsquo; property determines the
1808-
alignment of the replaced element inside its box.
1809-
<code>&lt;bg-position></code> comes from the <a
1810-
href="http://dev.w3.org/csswg/css3-background/#ltbg-positiongt">Backgrounds
1811-
&amp; Borders Module</a>, and is resolved in the same way, using the image
1812-
as the image and the content box as the positioning area. <a href="#CSS21"
1813-
rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a>
1808+
alignment of the replaced element inside its box. The <dfn
1809+
id=ltposition><code>&lt;position></code></dfn> value type is defined as
1810+
the positioning syntax of &lsquo;<code class=css><a
1811+
href="http://www.w3.org/TR/css3-background/#the-background-position">background-position</a></code>&rsquo;
1812+
and is resolved in the same way, using the image as the image and the
1813+
content box as the positioning area. <a href="#CSS21"
1814+
rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a> [[!CSS3BACKGROUND]]
18141815

18151816
<p class=note>Note that areas of the box not covered by the replaced
18161817
element will show the element's background.

0 commit comments

Comments
 (0)