[Webkit-unassigned] [Bug 285264] New: font-variant-caps: all-small-caps causes incorrect box-sizing in flex/inline context

[bugzilla-daemon at webkit.org]

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

            Bug ID: 285264
           Summary: font-variant-caps: all-small-caps causes incorrect
                    box-sizing in flex/inline context
           Product: WebKit
           Version: Safari 18
          Hardware: Mac (Apple Silicon)
                OS: macOS 15
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: New Bugs
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: chriskirknielsen+wkbugs at gmail.com

Created attachment 473723

  --> https://bugs.webkit.org/attachment.cgi?id=473723&action=review

Toggling the font-variation-caps rule showcases the element's box size does not change despite the smaller text occupying less space.

What happens is that the computed box for the text in small caps occupies the space of the standard text.
I am noticing this on page load on my website, but I need to trigger a repaint of sorts in this example CodePen (link below) by commenting out the `font-variation-caps` rule (see attachment).

CodePen demo: https://codepen.io/chriskirknielsen/pen/emOGyPj

Notes:
- Also happens on Safari on iOS 18.1.1
- This is only really a problem when alignment is obvious (so a block element outside a flex context is fine)
- Using `text-align: center` does not "fix" this issue
- While I think this might be related to bug #215693, this is not a broken rendering per se.

-- 
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/20241231/da2059d5/attachment.htm>