File tree 2 files changed +13
-4
lines changed
2 files changed +13
-4
lines changed Original file line number Diff line number Diff line change @@ -870,6 +870,9 @@ Inline/Main-Axis Alignment: the 'justify-self' property</h3>
870
870
while still respecting the constraints imposed by 'min-height' /'min-width' /'max-height' /'max-width' .
871
871
Unless otherwise specified, this value falls back to ''flex-start'' .
872
872
873
+ All other values cause a 'width' /'height' of ''width/auto''
874
+ to be treated as ''fit-content'' .
875
+
873
876
Issue: Should ''justify-self/stretch'' allow a fallback alignment,
874
877
like it does on 'align-content' and 'justify-content' ?
875
878
Original file line number Diff line number Diff line change @@ -1060,12 +1060,18 @@ Grid Items</h2>
1060
1060
Grid Item Sizing</h3>
1061
1061
1062
1062
A <a>grid item</a> is sized within the containing block defined by its <a>grid area</a>
1063
- similarly to an equivalent block-level box in an equivalently-sized containing block,
1064
- except that ''margin/auto'' margins and the <a>box alignment properties</a>
1065
- have special effects. (See [[#alignment]] .)
1063
+ using the 'width' calculation rules for non-replaced block boxes
1064
+ as defined in <a href="https://www.w3.org/TR/CSS21/visudet.html#blockwidth">CSS2.1 § 10.3.3</a>
1065
+ (meaning ''width/auto'' values in either axis are
1066
+ effectively sized to fill the remaining space).
1067
+ However, the <a>box alignment properties</a> have special effects:
1068
+ when 'align-self' /'justify-self' is neither ''justify-self/normal'' nor ''justify-self/stretch'' ,
1069
+ an ''width/auto'' size for the <a>grid item</a> in that axis
1070
+ is treated as ''width/fit-content'' instead of as the <a>fill-available size</a> .
1071
+ See [[#alignment]] .
1066
1072
1067
1073
Note: The ''min-width/auto'' value of 'min-width' and 'min-height'
1068
- behaves on <a>grid items</a> in the relevant axis
1074
+ affects track sizing in the relevant axis
1069
1075
similar to the flexbox behavior on <a>flex items</a> in the <a>main axis</a> .
1070
1076
See [[#min-size-auto]] .
1071
1077
You can’t perform that action at this time.
0 commit comments