[Webkit-unassigned] [Bug 190824] New: Content incorrectly breaks onto 2 lines in inline-block due to -apple-system font-family

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Tue Oct 23 06:16:03 PDT 2018


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

            Bug ID: 190824
           Summary: Content incorrectly breaks onto 2 lines in
                    inline-block due to -apple-system font-family
           Product: WebKit
           Version: Safari 12
          Hardware: Macintosh
                OS: macOS 10.14
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: me at jaydenseric.com
                CC: bfulgham at webkit.org, simon.fraser at apple.com,
                    zalan at apple.com

Created attachment 352970

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

Test case that renders incorrectly with text on two lines in Safari v12.

A combination of factors cause words to incorrectly wrap within an element:

- The element must be `display: inline-block`.
- The element must be, or inherit, `font-family: -apple-system`.
- The element must be `font-size: 0.8rem`. `em` units are the same. Decimal differences in the size value cause the bug to pop in and out of effect.
- The element must contain: `Verify<!-- --> card`. The comment and characters are important. Only a few characters can be substituted (such as "e" to "a") for the bug to display. This exact content with the HTML comment was generated by React in a real world project.

A test case HTML file is attached (along with a screenshot of how it renders incorrectly in Safari v12 if I can work out multiple attachments). If you toggle the font related style attributes off and on again enough times, eventually Safari will start rendering the text correctly on one line.

The test case renders correctly (all text on one line) in Chrome v69 and Firefox v63.

-- 
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/20181023/fd25cdcb/attachment.html>


More information about the webkit-unassigned mailing list