Content-Length: 359855 | pFad | http://github.com/w3c/csswg-drafts/commit/393a7fcdf641c5031fbd143a02f3d3fa9ff7ead8

80 [css-values-4] Specify the 'none' argument for clamp(). #9713 · w3c/csswg-drafts@393a7fc · GitHub
Skip to content
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit 393a7fc

Browse files
committedMar 7, 2024
[css-values-4] Specify the 'none' argument for clamp(). #9713
1 parent 36e6396 commit 393a7fc

File tree

1 file changed

+26
-1
lines changed

1 file changed

+26
-1
lines changed
 

‎css-values-4/Overview.bs

+26-1
Original file line numberDiff line numberDiff line change
@@ -3145,6 +3145,14 @@ Comparison Functions: ''min()'', ''max()'', and ''clamp()''</h3>
31453145
(That is, given ''clamp(MIN, VAL, MAX)'',
31463146
it represents exactly the same value as ''max(MIN, min(VAL, MAX))'').
31473147

3148+
Either the min or max calculations
3149+
(or even both)
3150+
can instead be the keyword <dfn value for=clamp()>none</dfn>,
3151+
which indicates the value is <em>not</em> clamped from that side.
3152+
(That is, ''clamp(MIN, VAL, none)'' is equivalent to ''max(MIN, VAL)'',
3153+
''clamp(none, VAL, MAX)'' is equivalent to ''min(VAL, MAX)'',
3154+
and ''clamp(none, VAL, none)'' is equivalent to just ''calc(VAL)''.)
3155+
31483156
For all three functions,
31493157
the argument [=calculations=] can resolve to any <<number>>, <<dimension>>, or <<percentage>>,
31503158
but must have a [=consistent type=]
@@ -3187,8 +3195,19 @@ Comparison Functions: ''min()'', ''max()'', and ''clamp()''</h3>
31873195
font-size: clamp(12px, 10 * (1vw + 1vh) / 2, 100px);
31883196
}
31893197
</pre>
3198+
3199+
Or, if you only wanted to impose a minimum size,
3200+
but allow the font-size to grow as large as it wants:
3201+
3202+
<pre class=lang-css>
3203+
.type {
3204+
/* Force the font-size to be at least 12px */
3205+
font-size: clamp(12px, 10 * (1vw + 1vh) / 2, none);
3206+
}
3207+
</pre>
31903208
</div>
31913209

3210+
31923211
<div class=note>
31933212
Note that ''clamp()'',
31943213
matching CSS conventions elsewhere,
@@ -4193,7 +4212,7 @@ Syntax</h3>
41934212
<<calc()>> = calc( <<calc-sum>> )
41944213
<<min()>> = min( <<calc-sum>># )
41954214
<<max()>> = max( <<calc-sum>># )
4196-
<<clamp()>> = clamp( <<calc-sum>>#{3} )
4215+
<<clamp()>> = clamp( [ <<calc-sum>> | none ], <<calc-sum>>, [ <<calc-sum>> | none ] )
41974216
<<round()>> = round( <<rounding-strategy>>?, <<calc-sum>>, <<calc-sum>> )
41984217
<<mod()>> = mod( <<calc-sum>>, <<calc-sum>> )
41994218
<<rem()>> = rem( <<calc-sum>>, <<calc-sum>> )
@@ -5495,7 +5514,13 @@ Recent Changes</h3>
54955514

54965515
(This is a subset of [[#additions-L3]].)
54975516

5517+
Substantial changes since <a href="https://www.w3.org/TR/2023/WD-css-values-4-20231218/">18 December 2023 WD</a>:
5518+
5519+
* Added the ''clamp()/none'' values to ''clamp()'',
5520+
(<a href="https://github.com/w3c/csswg-drafts/issues/9713">Issue 9713</a>)
5521+
54985522
Substantial changes since <a href="https://www.w3.org/TR/2023/WD-css-values-4-20231027/">27 October 2023 WD</a>:
5523+
54995524
* Pinned the [=default viewport-percentage units=] to the [=large viewport-percentage units=]--
55005525
despite violation of the “avoid dataloss by default principle”--
55015526
given existing interoperability and presumed Web-compat restriction.

0 commit comments

Comments
 (0)
Failed to load comments.








ApplySandwichStrip

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier!      Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

Fetched URL: http://github.com/w3c/csswg-drafts/commit/393a7fcdf641c5031fbd143a02f3d3fa9ff7ead8

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy