Skip to content

Commit 4fb1150

Browse files
committed
Allow object-fit and object-position to be aliased to image-fit and image-position, to be consistent with old Paged Media drafts
1 parent 69210a8 commit 4fb1150

2 files changed

Lines changed: 28 additions & 118 deletions

File tree

css3-images/Overview.html

Lines changed: 17 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,11 @@
1515

1616
<h1>CSS Images Module Level 3</h1>
1717

18-
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 24 August 2010</h2>
18+
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 25 August 2010</h2>
1919

2020
<dl>
2121
<dt>This version:</dt>
22-
<!-- <dd><a href="http://www.w3.org/TR/2010/CR-css3-images-20100824/">http://www.w3.org/TR/2010/CR-css3-images-20100824/</a></dd> -->
22+
<!-- <dd><a href="http://www.w3.org/TR/2010/CR-css3-images-20100825/">http://www.w3.org/TR/2010/CR-css3-images-20100825/</a></dd> -->
2323

2424
<dd><a
2525
href="http://dev.w3.org/csswg/css3-images/">http://dev.w3.org/csswg/css3-images/</a>
@@ -1282,6 +1282,12 @@ <h3 id=object-fit><span class=secno>6.3. </span>The &lsquo;<a
12821282
class=property>image-position</code>&rsquo; property for positioning the
12831283
object with respect to the element's box.</p>
12841284

1285+
<p>UAs may support &lsquo;<code class=property>image-fit</code>&rsquo; as
1286+
an alias for &lsquo;<a href="#object-fit0"><code
1287+
class=property>object-fit</code></a>&rsquo; when parsing CSS declarations
1288+
if they need to accommodate existing content that uses the &lsquo;<code
1289+
class=property>image-fit</code>&rsquo; property name.</p>
1290+
12851291
<p class=note>Note: the &lsquo;<a href="#object-fit0"><code
12861292
class=property>object-fit</code></a>&rsquo; property has similar
12871293
semantics to the fit attribute in <a href="#SMIL10"
@@ -1365,81 +1371,18 @@ <h3 id=object-position><span class=secno>6.4. </span>The &lsquo;<a
13651371
alignment of the replaced element inside its box. The values have the
13661372
same meaning as the values for the <a
13671373
href="/TR/CSS21/colors.html#propdef-background-position">&lsquo;<code
1368-
class=property>background-position</code>&rsquo;</a> property. <a
1374+
class=property>background-position</code>&rsquo;</a> property, using the
1375+
image as the image and the content box as the positioning area. <a
13691376
href="#CSS21" rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a></p>
13701377

1371-
<dl>
1372-
<dt>&lt;percentage&gt; &lt;percentage&gt;
1373-
1374-
<dd>With a value pair of &lsquo;<code class=css>0% 0%</code>&rsquo;, the
1375-
upper left corner of the image is aligned with the upper left corner of
1376-
the box's padding edge. A value pair of '100% 100%&lsquo;<code
1377-
class=css> places the lower right corner of the image in the lower right
1378-
corner of padding area. With a value pair of </code>&rsquo;14%
1379-
84%&lsquo;<code class=css>, the point 14% across and 84% down the image
1380-
is to be placed at the point 14% across and 84% down the padding
1381-
area.</code>
1382-
1383-
<dt>&lt;length&gt; &lt;length&gt;
1384-
1385-
<dd>With a value pair of &rsquo;2cm 2cm', the upper left corner of the
1386-
image is placed 2cm to the right and 2cm below the upper left corner of
1387-
the padding area.
1388-
1389-
<dt>&lsquo;<code class=css>top left</code>&rsquo;, &lsquo;<code
1390-
class=css>left top</code>&rsquo;
1391-
1392-
<dd>Same as &lsquo;<code class=css>0% 0%</code>&rsquo;.
1393-
1394-
<dt>&lsquo;<code class=property>top</code>&rsquo;, &lsquo;<code
1395-
class=css>top center</code>&rsquo;, &lsquo;<code class=css>center
1396-
top</code>&rsquo;
1397-
1398-
<dd>Same as &lsquo;<code class=css>50% 0%</code>&rsquo;.
1399-
1400-
<dt>&lsquo;<code class=css>right top</code>&rsquo;, &lsquo;<code
1401-
class=css>top right</code>&rsquo;
1402-
1403-
<dd>Same as &lsquo;<code class=css>100% 0%</code>&rsquo;.
1404-
1405-
<dt>&lsquo;<code class=property>left</code>&rsquo;, &lsquo;<code
1406-
class=css>left center</code>&rsquo;, &lsquo;<code class=css>center
1407-
left</code>&rsquo;
1408-
1409-
<dd>Same as &lsquo;<code class=css>0% 50%</code>&rsquo;.
1410-
1411-
<dt>&lsquo;<code class=property>center</code>&rsquo;, &lsquo;<code
1412-
class=css>center center</code>&rsquo;
1413-
1414-
<dd>Same as &lsquo;<code class=css>50% 50%</code>&rsquo;.
1415-
1416-
<dt>&lsquo;<code class=property>right</code>&rsquo;, &lsquo;<code
1417-
class=css>right center</code>&rsquo;, &lsquo;<code class=css>center
1418-
right</code>&rsquo;
1419-
1420-
<dd>Same as &lsquo;<code class=css>100% 50%</code>&rsquo;.
1421-
1422-
<dt>&lsquo;<code class=css>bottom left</code>&rsquo;, &lsquo;<code
1423-
class=css>left bottom</code>&rsquo;
1424-
1425-
<dd>Same as &lsquo;<code class=css>0% 100%</code>&rsquo;.
1426-
1427-
<dt>&lsquo;<code class=property>bottom</code>&rsquo;, &lsquo;<code
1428-
class=css>bottom center</code>&rsquo;, &lsquo;<code class=css>center
1429-
bottom</code>&rsquo;
1430-
1431-
<dd>Same as &lsquo;<code class=css>50% 100%</code>&rsquo;.
1432-
1433-
<dt>&lsquo;<code class=css>bottom right</code>&rsquo;, &lsquo;<code
1434-
class=css>right bottom</code>&rsquo;
1435-
1436-
<dd>Same as &lsquo;<code class=css>100% 100%</code>&rsquo;.
1437-
</dl>
1438-
1439-
<p>The computed value is the same as the specified value.</p>
1378+
<p class=note>Note that areas of the box not covered by the replaced
1379+
element will show the element's background.</p>
14401380

1441-
<p class=note>Note: areas of the box not covered by the replaced element
1442-
will show the element's background.</p>
1381+
<p>UAs may support &lsquo;<code class=property>image-fit</code>&rsquo; as
1382+
an alias for &lsquo;<a href="#object-fit0"><code
1383+
class=property>object-fit</code></a>&rsquo; when parsing CSS declarations
1384+
if they need to accommodate existing content that uses the &lsquo;<code
1385+
class=property>image-fit</code>&rsquo; property name.</p>
14431386
</div>
14441387

14451388
<h2 class=no-num id=acknowledgments>Acknowledgments</h2>

css3-images/Overview.src.html

Lines changed: 11 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -681,6 +681,10 @@ <h3 id="object-fit">The 'object-fit' Property</h3>
681681
'image-position' property for positioning the object with respect to the
682682
element's box.</p>
683683

684+
<p>UAs may support 'image-fit' as an alias for 'object-fit' when parsing
685+
CSS declarations if they need to accommodate existing content that uses
686+
the 'image-fit' property name.</p>
687+
684688
<p class="note">Note: the 'object-fit' property has similar semantics to
685689
the fit attribute in [[SMIL10]].</p>
686690

@@ -728,53 +732,16 @@ <h3 id="object-position">The 'object-position' Property</h3>
728732
<p>The 'object-position' property determines the alignment of the replaced
729733
element inside its box. The values have the same meaning as the values for
730734
the <a href="/TR/CSS21/colors.html#propdef-background-position">'background-position'</a>
731-
property. [[!CSS21]]</p>
732-
<dl>
733-
734-
<dt>&lt;percentage&gt; &lt;percentage&gt;</dt>
735-
<dd>With a value pair of '0% 0%', the upper left corner of the image is aligned
736-
with the upper left corner of the box's padding edge. A value pair of '100%
737-
100%' places the lower right corner of the image in the lower right corner of
738-
padding area. With a value pair of '14% 84%', the point 14% across and 84% down
739-
the image is to be placed at the point 14% across and 84% down the padding
740-
area.</dd>
741-
742-
<dt>&lt;length&gt; &lt;length&gt;</dt>
743-
<dd>With a value pair of '2cm 2cm', the upper left corner of the image is placed
744-
2cm to the right and 2cm below the upper left corner of the padding area.</dd>
745-
746-
<dt>'top left', 'left top'</dt>
747-
<dd>Same as '0% 0%'.</dd>
748-
749-
<dt>'top', 'top center', 'center top'</dt>
750-
<dd>Same as '50% 0%'.</dd>
751-
752-
<dt>'right top', 'top right'</dt>
753-
<dd>Same as '100% 0%'.</dd>
754-
755-
<dt>'left', 'left center', 'center left'</dt>
756-
<dd>Same as '0% 50%'.</dd>
735+
property, using the image as the image and the content box as the positioning
736+
area. [[!CSS21]]</p>
757737

758-
<dt>'center', 'center center'</dt>
759-
<dd>Same as '50% 50%'.</dd>
760-
761-
<dt>'right', 'right center', 'center right'</dt>
762-
<dd>Same as '100% 50%'.</dd>
763-
764-
<dt>'bottom left', 'left bottom'</dt>
765-
<dd>Same as '0% 100%'.</dd>
766-
767-
<dt>'bottom', 'bottom center', 'center bottom'</dt>
768-
<dd>Same as '50% 100%'.</dd>
769-
770-
<dt>'bottom right', 'right bottom'</dt>
771-
<dd>Same as '100% 100%'.</dd>
772-
</dl>
773-
774-
<p>The computed value is the same as the specified value.</p>
775-
<p class="note">Note: areas of the box not covered by the replaced
738+
<p class="note">Note that areas of the box not covered by the replaced
776739
element will show the element's background.</p>
777740

741+
<p>UAs may support 'image-fit' as an alias for 'object-fit' when parsing
742+
CSS declarations if they need to accommodate existing content that uses
743+
the 'image-fit' property name.</p>
744+
778745
</div>
779746

780747
<h2 class="no-num" id="acknowledgments">Acknowledgments</h2>

0 commit comments

Comments
 (0)