Skip to content

Commit 3248d20

Browse files
tabatkinstabatkins
committed
Changed the reference for the default image sizing area in 'border-image'.
Annotated more of the chapter 6 references to be real xrefs.
1 parent b5ec9cc commit 3248d20

2 files changed

Lines changed: 93 additions & 73 deletions

File tree

‎css3-images/Overview.html‎

Lines changed: 65 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -20,12 +20,12 @@
2020

2121
<h1>CSS Image Values and Replaced Content Module Level 3</h1>
2222

23-
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 18 January
23+
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 19 January
2424
2011</h2>
2525

2626
<dl>
2727
<dt>This version:</dt>
28-
<!-- <dd><a href="http://www.w3.org/TR/2011/CR-css3-images-20110118/">http://www.w3.org/TR/2011/CR-css3-images-20110118/</a></dd> -->
28+
<!-- <dd><a href="http://www.w3.org/TR/2011/CR-css3-images-20110119/">http://www.w3.org/TR/2011/CR-css3-images-20110119/</a></dd> -->
2929

3030
<dd><a
3131
href="http://dev.w3.org/csswg/css3-images/">http://dev.w3.org/csswg/css3-images/</a>
@@ -1191,7 +1191,7 @@ <h2 id=sizing><span class=secno>6. </span>Sizing Images and Objects in CSS</h2>
11911191
<dt>&lsquo;<code class=property>border-image</code>&rsquo;
11921192

11931193
<dd>The <a href="#default-image-sizing-area"><b>default image sizing
1194-
area</b></a> is the size of the border box of the element.
1194+
area</b></a> is the size of the element's <b>border image area</b>.
11951195

11961196
<dt>&lsquo;<code class=property>cursor</code>&rsquo;
11971197

@@ -1211,60 +1211,80 @@ <h2 id=sizing><span class=secno>6. </span>Sizing Images and Objects in CSS</h2>
12111211
<ol>
12121212
<li>When an image or object is specified in a document, such as through
12131213
url() value in a background-image property or a @src attribute on an
1214-
&lt;img> element, CSS queries the object for its intrinsic size.
1215-
1216-
<li>Using the intrinsic dimensions and the specified size, CSS then
1217-
computes a CSS View Box that defines the size of the region the object
1218-
will render in, as follows:
1214+
&lt;img> element, CSS queries the object for its <a
1215+
href="#intrinsic-dimensions"><b>intrinsic dimensions</b></a>.
1216+
1217+
<li>Using the <a href="#intrinsic-dimensions"><b>intrinsic
1218+
dimensions</b></a> and the <a href="#specified-size"><b>specified
1219+
size</b></a>, CSS then computes a <a href="#css-view-box"><b>CSS View
1220+
Box</b></a> that defines the size of the region the object will render
1221+
in, as follows:
12191222
<ol>
1220-
<li>If the specified size is just a definite width and height, the CSS
1221-
View Box must be that width and height.
1222-
1223-
<li>If the specified size is just a definite width or just a definite
1224-
height, then the CSS View Box must have the same width or height, as
1225-
appropriate. The other dimension is calculated as follows:
1223+
<li>If the <a href="#specified-size"><b>specified size</b></a> is just
1224+
a definite width and height, the <a href="#css-view-box"><b>CSS View
1225+
Box</b></a> must be that width and height.
1226+
1227+
<li>If the <a href="#specified-size"><b>specified size</b></a> is just
1228+
a definite width or just a definite height, then the <a
1229+
href="#css-view-box"><b>CSS View Box</b></a> must have the same width
1230+
or height, as appropriate. The other dimension is calculated as
1231+
follows:
12261232
<ol>
1227-
<li>If the object has an intrinsic aspect ratio, the CSS View Box
1228-
must have the same aspect ratio.
1233+
<li>If the object has an intrinsic aspect ratio, the <a
1234+
href="#css-view-box"><b>CSS View Box</b></a> must have the same
1235+
aspect ratio.
12291236

12301237
<li>Otherwise, if the object has an an intrinsic height or intrinsic
1231-
width (whichever is missing from the specified size), then the CSS
1232-
View Box must have that height or width.
1233-
1234-
<li>Otherwise, the CSS View Box must have the same width or height
1235-
(whichever is missing from the specified size) as the default image
1236-
sizing area.
1238+
width (whichever is missing from the <a
1239+
href="#specified-size"><b>specified size</b></a>), then the <a
1240+
href="#css-view-box"><b>CSS View Box</b></a> must have that height
1241+
or width.
1242+
1243+
<li>Otherwise, the <a href="#css-view-box"><b>CSS View Box</b></a>
1244+
must have the same width or height (whichever is missing from the
1245+
specified size) as the <a
1246+
href="#default-image-sizing-area"><b>default image sizing
1247+
area</b></a>.
12371248
</ol>
12381249

1239-
<li>If the specified size is neither a definite width nor height, and
1240-
has no additional contraints, the dimensions of the CSS View Box must
1241-
be computed as follows:
1250+
<li>If the <a href="#specified-size"><b>specified size</b></a> is
1251+
neither a definite width nor height, and has no additional contraints,
1252+
the dimensions of the <a href="#css-view-box"><b>CSS View Box</b></a>
1253+
must be computed as follows:
12421254
<ol>
12431255
<li>If the object has an intrinsic width and an intrinsic height, the
1244-
CSS View Box must have that same height and width.
1256+
<a href="#css-view-box"><b>CSS View Box</b></a> must have that same
1257+
height and width.
12451258

12461259
<li>If the object has only an intrinsic width or intrinsic height,
1247-
and no intrinsic aspect ratio, the CSS View Box must have that width
1248-
or height, and the height or width (whichever is missing from the
1249-
intrinsic dimensions) of the default image sizing area.
1250-
1251-
<li>If the object has only an intrinsic aspect ratio, the CSS View
1252-
Box must have that aspect ratio, and additionally be as large as
1253-
possible without either its height or width exceeding the height or
1254-
width of the default image sizing area.
1255-
1256-
<li>Otherwise, the CSS View Box must be the size of the default image
1257-
sizing area.
1260+
and no intrinsic aspect ratio, the <a href="#css-view-box"><b>CSS
1261+
View Box</b></a> must have that width or height, and the height or
1262+
width (whichever is missing from the intrinsic dimensions) of the <a
1263+
href="#default-image-sizing-area"><b>default image sizing
1264+
area</b></a>.
1265+
1266+
<li>If the object has only an intrinsic aspect ratio, the <a
1267+
href="#css-view-box"><b>CSS View Box</b></a> must have that aspect
1268+
ratio, and additionally be as large as possible without either its
1269+
height or width exceeding the height or width of the <a
1270+
href="#default-image-sizing-area"><b>default image sizing
1271+
area</b></a>.
1272+
1273+
<li>Otherwise, the <a href="#css-view-box"><b>CSS View Box</b></a>
1274+
must be the size of the <a
1275+
href="#default-image-sizing-area"><b>default image sizing
1276+
area</b></a>.
12581277
</ol>
12591278

1260-
<li>If the specified size has additional constraints, the CSS View Box
1261-
must be sized to satisfy those constraints. (For example, &lsquo;<code
1262-
class=css>object-fit: contain</code>&rsquo; specifies slightly more
1263-
complex handling for sizing replaced elements, and &lsquo;<code
1264-
class=css>background-repeat: round</code>&rsquo; can adjust the size
1265-
specified in &lsquo;<code class=property>background-size</code>&rsquo;
1266-
so that the image fits an even number of times into the background
1267-
positioning area.)
1279+
<li>If the <a href="#specified-size"><b>specified size</b></a> has
1280+
additional constraints, the <a href="#css-view-box"><b>CSS View
1281+
Box</b></a> must be sized to satisfy those constraints. (For example,
1282+
&lsquo;<code class=css>object-fit: contain</code>&rsquo; specifies
1283+
slightly more complex handling for sizing replaced elements, and
1284+
&lsquo;<code class=css>background-repeat: round</code>&rsquo; can
1285+
adjust the size specified in &lsquo;<code
1286+
class=property>background-size</code>&rsquo; so that the image fits an
1287+
even number of times into the background positioning area.)
12681288
</ol>
12691289
</ol>
12701290

‎css3-images/Overview.src.html‎

Lines changed: 28 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -836,8 +836,8 @@ <h2 id="sizing">Sizing Images and Objects in CSS</h2>
836836
<dd>The <b>default image sizing area</b> is a 1em square.</dd>
837837

838838
<dt>'border-image'</dt>
839-
<dd>The <b>default image sizing area</b> is the size of the border box
840-
of the element.</dd>
839+
<dd>The <b>default image sizing area</b> is the size of the element's
840+
<b>border image area</b>.</dd>
841841

842842
<dt>'cursor'</dt>
843843
<dd>The <b>default image sizing area</b> is a UA-defined size that should
@@ -855,58 +855,58 @@ <h2 id="sizing">Sizing Images and Objects in CSS</h2>
855855
<ol>
856856
<li>When an image or object is specified in a document, such as through url()
857857
value in a background-image property or a @src attribute on an &lt;img> element,
858-
CSS queries the object for its intrinsic size.</li>
858+
CSS queries the object for its <b>intrinsic dimensions</b>.</li>
859859

860-
<li>Using the intrinsic dimensions and the specified size, CSS then computes
861-
a CSS View Box that defines the size of the region the object will render
862-
in, as follows:
860+
<li>Using the <b>intrinsic dimensions</b> and the <b>specified size</b>,
861+
CSS then computes a <b>CSS View Box</b> that defines the size of the region the
862+
object will render in, as follows:
863863

864864
<ol>
865-
<li>If the specified size is just a definite width and height, the
866-
CSS View Box must be that width and height.</li>
867-
<li>If the specified size is just a definite width or just a definite
868-
height, then the CSS View Box must have the same width or height, as
865+
<li>If the <b>specified size</b> is just a definite width and height, the
866+
<b>CSS View Box</b> must be that width and height.</li>
867+
<li>If the <b>specified size</b> is just a definite width or just a definite
868+
height, then the <b>CSS View Box</b> must have the same width or height, as
869869
appropriate. The other dimension is calculated as follows:
870870

871871
<ol>
872-
<li>If the object has an intrinsic aspect ratio, the CSS View
873-
Box must have the same aspect ratio.</li>
872+
<li>If the object has an intrinsic aspect ratio, the <b>CSS View Box</b>
873+
must have the same aspect ratio.</li>
874874

875875
<li>Otherwise, if the object has an an intrinsic height or
876-
intrinsic width (whichever is missing from the specified size),
877-
then the CSS View Box must have that height or width.</li>
876+
intrinsic width (whichever is missing from the <b>specified size</b>),
877+
then the <b>CSS View Box</b> must have that height or width.</li>
878878

879-
<li>Otherwise, the CSS View Box must have the same width or
879+
<li>Otherwise, the <b>CSS View Box</b> must have the same width or
880880
height (whichever is missing from the specified size) as the
881-
default image sizing area.</li>
881+
<b>default image sizing area</b>.</li>
882882
</ol>
883883
</li>
884884

885-
<li>If the specified size is neither a definite width nor height, and
886-
has no additional contraints, the dimensions of the CSS View Box must
885+
<li>If the <b>specified size</b> is neither a definite width nor height, and
886+
has no additional contraints, the dimensions of the <b>CSS View Box</b> must
887887
be computed as follows:
888888

889889
<ol>
890890
<li>If the object has an intrinsic width and an intrinsic height,
891-
the CSS View Box must have that same height and width.</li>
891+
the <b>CSS View Box</b> must have that same height and width.</li>
892892

893893
<li>If the object has only an intrinsic width or intrinsic height,
894-
and no intrinsic aspect ratio, the CSS View Box must have that
894+
and no intrinsic aspect ratio, the <b>CSS View Box</b> must have that
895895
width or height, and the height or width (whichever is missing
896-
from the intrinsic dimensions) of the default image sizing area.</li>
896+
from the intrinsic dimensions) of the <b>default image sizing area</b>.</li>
897897

898-
<li>If the object has only an intrinsic aspect ratio, the CSS
899-
View Box must have that aspect ratio, and additionally be as
898+
<li>If the object has only an intrinsic aspect ratio, the
899+
<b>CSS View Box</b> must have that aspect ratio, and additionally be as
900900
large as possible without either its height or width exceeding
901-
the height or width of the default image sizing area.</li>
901+
the height or width of the <b>default image sizing area</b>.</li>
902902

903-
<li>Otherwise, the CSS View Box must be the size of the default
904-
image sizing area.</li>
903+
<li>Otherwise, the <b>CSS View Box</b> must be the size of the
904+
<b>default image sizing area</b>.</li>
905905
</ol>
906906
</li>
907907

908-
<li>If the specified size has additional constraints, the CSS View
909-
Box must be sized to satisfy those constraints. (For example,
908+
<li>If the <b>specified size</b> has additional constraints, the
909+
<b>CSS View Box</b> must be sized to satisfy those constraints. (For example,
910910
''object-fit: contain'' specifies slightly more complex handling for
911911
sizing replaced elements, and ''background-repeat: round'' can adjust
912912
the size specified in 'background-size' so that the image fits an even

0 commit comments

Comments
 (0)