Skip to content

Commit ecd474c

Browse files
committed
[css-align] Make stretch actually work for abspos boxes.
1 parent bbc24c8 commit ecd474c

2 files changed

Lines changed: 19 additions & 21 deletions

File tree

css-align/Overview.bs

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -607,7 +607,7 @@ Inline/Main-Axis Alignment: the 'justify-self' property</h3>
607607
<a href="#alignment-values">as described by its alignment value</a>.
608608

609609
The <dfn value for="justify-self">auto</dfn> keyword computes to
610-
''<item-position>/stretch'' on absolutely-positioned elements,
610+
itself on absolutely-positioned elements,
611611
and to the computed value of 'justify-items' on the parent
612612
(minus any ''legacy'' keywords) on all other boxes.
613613

@@ -654,7 +654,8 @@ Inline/Main-Axis Alignment: the 'justify-self' property</h3>
654654
are ignored in favor of alignment as specified here
655655
and the used value of the offset properties are not adjusted to correct for the over-constraint.
656656

657-
The ''<item-position>/stretch'' keyword is equivalent to ''start'' on replaced absolutely-positioned boxes.
657+
The ''justify-self/auto'' keyword is equivalent to ''start'' on replaced absolutely-positioned boxes,
658+
and equivalent to ''<item-position>/stretch'' on all other absolutely-positioned boxes.
658659
(This is because CSS 2.1 does not stretch replaced elements to fit into fixed offsets.)
659660

660661
<dt>Table Cells:
@@ -711,7 +712,7 @@ Block/Cross-Axis Alignment: the 'align-self' property</h3>
711712
<a href="#alignment-values">as described by its alignment value</a>.
712713

713714
The <dfn value for="align-self">auto</dfn> keyword computes to
714-
''<item-position>/stretch'' on absolutely-positioned elements,
715+
itself on absolutely-positioned elements,
715716
and to the computed value of 'align-items' on the parent
716717
(minus any ''legacy'' keywords) on all other boxes.
717718

@@ -744,7 +745,8 @@ Block/Cross-Axis Alignment: the 'align-self' property</h3>
744745
are ignored in favor of alignment as specified here
745746
and the used value of the offset properties are not adjusted to correct for the over-constraint.
746747

747-
The ''<item-position>/stretch'' keyword is equivalent to ''start'' on replaced absolutely-positioned boxes.
748+
The ''align-self/auto'' keyword is equivalent to ''start'' on replaced absolutely-positioned boxes,
749+
and equivalent to ''<item-position>/stretch'' on all other absolutely-positioned boxes.
748750
(This is because CSS 2.1 does not stretch replaced elements to fit into fixed offsets.)
749751

750752
<dt>Table Cells:
@@ -1046,12 +1048,9 @@ Changes</h2>
10461048

10471049
Changes since the <a href="http://www.w3.org/TR/2013/WD-css3-align-20130514/">previous Working Draft</a> include:
10481050

1049-
<ul>
1050-
<li>
1051-
Added ''last-baseline'' keyword.
1052-
<li>
1053-
Improved details of baseline alignment.
1054-
</ul>
1051+
* Added ''last-baseline'' keyword.
1052+
* Improved details of baseline alignment.
1053+
* Changed handling of ''justify-self/auto''/''<item-position>/stretch'' for block-level and abspos elements in 'justify-self'/'align-self' to be more powerful and less confusing.
10551054

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

css-align/Overview.html

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -713,7 +713,7 @@ <h3 class="heading settled" data-level=5.1 id=justify-self-property><span class=
713713
<a href=#alignment-values>as described by its alignment value</a>.</p>
714714

715715
<p>The <dfn class=css data-dfn-for=justify-self data-dfn-type=value data-export="" id=valdef-justify-self-auto>auto<a class=self-link href=#valdef-justify-self-auto></a></dfn> keyword computes to
716-
<a class=css data-link-for="" data-link-type=maybe href=#valdef-item-position-stretch>stretch</a> on absolutely-positioned elements,
716+
itself on absolutely-positioned elements,
717717
and to the computed value of <a class=property data-link-type=propdesc href=#propdef-justify-items>justify-items</a> on the parent
718718
(minus any <a class=css data-link-type=maybe href=#valdef-justify-items-legacy>legacy</a> keywords) on all other boxes.</p>
719719

@@ -760,7 +760,8 @@ <h3 class="heading settled" data-level=5.1 id=justify-self-property><span class=
760760
are ignored in favor of alignment as specified here
761761
and the used value of the offset properties are not adjusted to correct for the over-constraint.</p>
762762

763-
<p>The <a class=css data-link-for="" data-link-type=maybe href=#valdef-item-position-stretch>stretch</a> keyword is equivalent to <a class=css data-link-type=maybe href=#valdef-item-position-content-position-start>start</a> on replaced absolutely-positioned boxes.
763+
<p>The <a class=css data-link-for=justify-self data-link-type=maybe href=#valdef-justify-self-auto>auto</a> keyword is equivalent to <a class=css data-link-type=maybe href=#valdef-item-position-content-position-start>start</a> on replaced absolutely-positioned boxes,
764+
and equivalent to <a class=css data-link-for="" data-link-type=maybe href=#valdef-item-position-stretch>stretch</a> on all other absolutely-positioned boxes.
764765
(This is because CSS 2.1 does not stretch replaced elements to fit into fixed offsets.)</p>
765766

766767
<dt>Table Cells:
@@ -807,7 +808,7 @@ <h3 class="heading settled" data-level=5.2 id=align-self-property><span class=se
807808
<a href=#alignment-values>as described by its alignment value</a>.</p>
808809

809810
<p>The <dfn class=css data-dfn-for=align-self data-dfn-type=value data-export="" id=valdef-align-self-auto>auto<a class=self-link href=#valdef-align-self-auto></a></dfn> keyword computes to
810-
<a class=css data-link-for="" data-link-type=maybe href=#valdef-item-position-stretch>stretch</a> on absolutely-positioned elements,
811+
itself on absolutely-positioned elements,
811812
and to the computed value of <a class=property data-link-type=propdesc href=#propdef-align-items>align-items</a> on the parent
812813
(minus any <a class=css data-link-type=maybe href=#valdef-justify-items-legacy>legacy</a> keywords) on all other boxes.</p>
813814

@@ -840,7 +841,8 @@ <h3 class="heading settled" data-level=5.2 id=align-self-property><span class=se
840841
are ignored in favor of alignment as specified here
841842
and the used value of the offset properties are not adjusted to correct for the over-constraint.</p>
842843

843-
<p>The <a class=css data-link-for="" data-link-type=maybe href=#valdef-item-position-stretch>stretch</a> keyword is equivalent to <a class=css data-link-type=maybe href=#valdef-item-position-content-position-start>start</a> on replaced absolutely-positioned boxes.
844+
<p>The <a class=css data-link-for=align-self data-link-type=maybe href=#valdef-align-self-auto>auto</a> keyword is equivalent to <a class=css data-link-type=maybe href=#valdef-item-position-content-position-start>start</a> on replaced absolutely-positioned boxes,
845+
and equivalent to <a class=css data-link-for="" data-link-type=maybe href=#valdef-item-position-stretch>stretch</a> on all other absolutely-positioned boxes.
844846
(This is because CSS 2.1 does not stretch replaced elements to fit into fixed offsets.)</p>
845847

846848
<dt>Table Cells:
@@ -1123,13 +1125,10 @@ <h2 class="heading settled" data-level=8 id=changes><span class=secno>8. </span>
11231125

11241126
<p>Changes since the <a href=http://www.w3.org/TR/2013/WD-css3-align-20130514/>previous Working Draft</a> include:</p>
11251127

1126-
<ul>
1127-
<li>
1128-
Added <a class=css data-link-type=maybe href=#valdef-justify-content-justify-self-justify-items-align-content-align-self-align-items-last-baseline>last-baseline</a> keyword.
1129-
<li>
1130-
Improved details of baseline alignment.
1131-
</ul>
1132-
1128+
<ul><li data-md=""><p>Added <a class=css data-link-type=maybe href=#valdef-justify-content-justify-self-justify-items-align-content-align-self-align-items-last-baseline>last-baseline</a> keyword.</p>
1129+
<li data-md=""><p>Improved details of baseline alignment.</p>
1130+
<li data-md=""><p>Changed handling of <a class=css data-link-for=justify-self data-link-type=maybe href=#valdef-justify-self-auto>auto</a>/<a class=css data-link-for="" data-link-type=maybe href=#valdef-item-position-stretch>stretch</a> for block-level and abspos elements in <a class=property data-link-type=propdesc href=#propdef-justify-self>justify-self</a>/<a class=property data-link-type=propdesc href=#propdef-align-self>align-self</a> to be more powerful and less confusing.</p>
1131+
</ul>
11331132
<h2 class="no-num heading settled" id=acknowledgments><span class=content>
11341133
Acknowledgments</span><a class=self-link href=#acknowledgments></a></h2>
11351134

0 commit comments

Comments
 (0)