Bug 212522 – font-size is not computed correctly when specified by CSS clamp(). implementation incomplete

• Status: NEW
• Component: CSS

[Wes Bos]

CSS clamp() function is missing two features that the rest of the browsers have implemented:


First, it does not allow for calculating the font size:

```html
  <h2>Clamp Me</h2>

  <style>
    h2 {
      font-size: clamp(30px, 20vw + 5rem, 300px);
      /* Or with calc(), which isn't needed: */
      font-size: clamp(30px, calc(20vw + 5rem), 300px);
    }
  </style>
```

This feature is needed because viewport units as font sizes are inaccessible as they do not get bigger/smaller when the user zooms in or out. 


Second, the browser doesn't repaint the size of the font when the browser is resized:

```html
  <h2>Clamp Me</h2>

  <style>
    h2 {
      font-size: clamp(30px, 20vw, 300px);
    }
  </style>
```


Resize the browser, and you'll see the font size doesn't change. Reload the page at a smaller browser width and it does resize. 


Confirmed in Release 107 (Safari 13.2, WebKit 15610.1.14.1)

[Radar WebKit Bug Importer]

<rdar://problem/63851634>

[Peter]

Any updates? Still an issue in Version 14.1 (16611.1.21.161.3)

[Karl Dubost]

*** Bug 284955 has been marked as a duplicate of this bug. ***

[Karl Dubost]

Probably there is a WPT missing for this. Maybe it will be hard to create because of its dependency on zooming
https://wpt.fyi/results/css?label=master&label=experimental&aligned&q=clamp

[fantasai]

Created attachment 474238 [details]
testcase

I think this might have been fixed during Sam's rewrite of our unit handling code. At least, I can't figure out how to reproduce it. Reporter, can you check in a recent STP or WebKit build?