Bug 225207

Summary:	Regression: animation on pseudo element ruins flex layout
Product:	WebKit	Reporter:	tomala <spam>
Component:	CSS	Assignee:	Nobody <webkit-unassigned>
Status:	RESOLVED DUPLICATE
Severity:	Normal	CC:	graouts, simon.fraser, webkit-bug-importer, zalan
Priority:	P2	Keywords:	InRadar
Version:	Safari 14
Hardware:	iPhone / iPad
OS:	iOS 14

Description tomala 2021-04-29 13:34:54 PDT

Css transition on some border property of pseudo element (eg. border-color or border-width) results in ruined flex layout.

Behavior documented in codepen: https://codepen.io/t100/pen/mdRYXZw (clicking on label should not change elements arrangement, unfortunately that's not true for Safari and Chrome on iOS 14.5).

Comment 1 Radar WebKit Bug Importer 2021-05-01 14:35:34 PDT

<rdar://problem/77422521>

Comment 2 Antoine Quint 2021-05-02 03:45:42 PDT

This appears to be already fixed on ToT.

Comment 3 Antoine Quint 2021-05-02 04:31:17 PDT

This was fixed in r275277 for bug 223990.

*** This bug has been marked as a duplicate of bug 223990 ***

Comment 4 Antoine Quint 2021-05-02 04:33:07 PDT

This should be fixed in the existing iOS 14.6 beta or an upcoming one.