[Webkit-unassigned] [Bug 240103] New: flex-box wont transition if a value is percentage

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Wed May 4 17:53:50 PDT 2022


https://bugs.webkit.org/show_bug.cgi?id=240103

            Bug ID: 240103
           Summary: flex-box wont transition if a value is percentage
           Product: WebKit
           Version: Safari 15
          Hardware: Unspecified
                OS: macOS 12
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: rhys at foxo.com

MacOs 12.2.1 (safari 15.3) / iPad OS 15.0

Percentages in flex-basis cause transition to stop working.

The following used to work and still does on other browsers:

```
div {
  flex-basis: min(200px, 33%);
  transition: all ease-out .25s;
}
div:hover {
  flex-basis: 300px;
}
```

The problem isn't with using min because:

The following also doesnt work:

```
div {
  flex-basis: 33%;
  transition: all ease-out .25s;
}
div:hover {
  flex-basis: 300px;
}
```

While this does:

```
div {
  flex-basis: flex-basis: min(200px,500px);
  transition: all ease-out .25s;
}
div:hover {
  flex-basis: 300px;
}
```

Also using the 1st example and width instead of flex-basis transitions fine even tho the min contains a percentage

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20220505/dcb42538/attachment-0001.htm>


More information about the webkit-unassigned mailing list