Skip to content

Commit

Permalink
[css-sizing] Make block dimension behave like auto for all -content k…
Browse files Browse the repository at this point in the history
…eywords, per WG resolution.
  • Loading branch information
fantasai committed Jan 24, 2017
1 parent 8b287d3 commit 2eda98a
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 42 deletions.
34 changes: 14 additions & 20 deletions css-sizing-3/Overview.bs
Original file line number Diff line number Diff line change
Expand Up @@ -267,27 +267,32 @@ New Keywords for 'width' and 'height'</h3>

<dt><dfn>max-content</dfn>
<dd>
Use the <a>max-content inline size</a> or <a>max-content block size</a>,
as appropriate to the writing mode.
If specified for the inline axis,
use the <a>max-content inline size</a>;
otherwise compute to ''width/auto''.

<dt><dfn>min-content</dfn>
<dd>
Use the <a>min-content inline size</a> or <a>min-content block size</a>,
as appropriate to the writing mode.
If specified for the inline axis,
use the <a>min-content inline size</a>;
otherwise compute to ''width/auto''.

<dt><dfn>fit-content</dfn>
<dd>
Use the <a>fit-content inline size</a> or <a>fit-content block size</a>,
as appropriate to the writing mode,
If specified for the inline axis,
use the <a>max-content inline size</a>
i.e.
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <a>fill-available size</a>))</code>
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <a>fill-available size</a>))</code>;
otherwise compute to ''width/auto''.

<dt><dfn>fit-content(<<length-percentage>>)</dfn>
<dd>
Use the fit-content formula
If specified for the inline axis,
use the fit-content formula
with the <a>available space</a> replaced by the specified argument,
i.e.
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <<length-percentage>>))</code>
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <<length-percentage>>))</code>;
otherwise compute to ''width/auto''.
</dl>

Issue: Is ''width/stretch'' stable enough or should we defer to L4?
Expand All @@ -298,15 +303,6 @@ New Keywords for 'width' and 'height'</h3>
this is true automatically.
For Block layout, this means using ''display: flow-root;''.

<p class="issue">
Right now all of these except ''width/fill'' mean the same thing
for block-sizes. This may or may not be ideal.

<p class='issue'>
If the inline-size is ''width/auto'',
we could have min-content block-size imply a max-content inline-size,
and vice versa.

<p class='note'>
Note that percentages resolved against the intrinsic sizes
(''width/max-content'', ''width/min-content'', ''width/fit-content'')
Expand Down Expand Up @@ -354,10 +350,8 @@ Column Sizing Keywords</h3>
<dd>
Specifies the optimal column width as
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <<length-percentage>>))</code>

</dl>


<h2 id='intrinsic'>
Intrinsic Size Determination</h2>

Expand Down
36 changes: 14 additions & 22 deletions css-sizing/Overview.bs
Original file line number Diff line number Diff line change
Expand Up @@ -265,31 +265,34 @@ New Keywords for 'width' and 'height'</h3>
It allows re-using this formula for boxes that are otherwise shrink-wrapped,
like tables.

Issue: The working group agreed to rename this to <dfn>stretch</dfn> on 2017-01-13.

<dt><dfn>max-content</dfn>
<dd>
Use the <a>max-content inline size</a> or <a>max-content block size</a>,
as appropriate to the writing mode.
If specified for the inline axis,
use the <a>max-content inline size</a>;
otherwise compute to ''width/auto''.

<dt><dfn>min-content</dfn>
<dd>
Use the <a>min-content inline size</a> or <a>min-content block size</a>,
as appropriate to the writing mode.
If specified for the inline axis,
use the <a>min-content inline size</a>;
otherwise compute to ''width/auto''.

<dt><dfn>fit-content</dfn>
<dd>
Use the <a>fit-content inline size</a> or <a>fit-content block size</a>,
as appropriate to the writing mode,
If specified for the inline axis,
use the <a>max-content inline size</a>
i.e.
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <a>fill-available size</a>))</code>
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <a>fill-available size</a>))</code>;
otherwise compute to ''width/auto''.

<dt><dfn>fit-content(<<length-percentage>>)</dfn>
<dd>
Use the fit-content formula
If specified for the inline axis,
use the fit-content formula
with the <a>available space</a> replaced by the specified argument,
i.e.
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <<length-percentage>>))</code>
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <<length-percentage>>))</code>;
otherwise compute to ''width/auto''.
</dl>

Note: To size an element such that it avoids overlapping sibling floats,
Expand All @@ -298,15 +301,6 @@ New Keywords for 'width' and 'height'</h3>
this is true automatically.
For Block layout, this means using ''display: flow-root;''.

<p class="issue">
Right now all of these except ''width/stretch'' mean the same thing
for block-sizes. This may or may not be ideal.

<p class='issue'>
If the inline-size is ''width/auto'',
we could have min-content block-size imply a max-content inline-size,
and vice versa.

<p class='note'>
Note that percentages resolved against the intrinsic sizes
(''width/max-content'', ''width/min-content'', ''width/fit-content'')
Expand Down Expand Up @@ -354,10 +348,8 @@ Column Sizing Keywords</h3>
<dd>
Specifies the optimal column width as
<code>min(<a>max-content size</a>, max(<a>min-content size</a>, <<length-percentage>>))</code>

</dl>


<h2 id='intrinsic'>
Intrinsic Size Determination</h2>

Expand Down

0 comments on commit 2eda98a

Please sign in to comment.