| Summary: | Space too large when using icon font in ::after pseudo element | ||||||
|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | literalPie <benjaminkindle> | ||||
| Component: | Text | Assignee: | Nobody <webkit-unassigned> | ||||
| Status: | RESOLVED CONFIGURATION CHANGED | ||||||
| Severity: | Normal | CC: | gsnedders, mmaxfield, webkit-bug-importer, zalan | ||||
| Priority: | P2 | Keywords: | InRadar | ||||
| Version: | Safari Technology Preview | ||||||
| Hardware: | Mac (Intel) | ||||||
| OS: | macOS 11 | ||||||
| Attachments: |
|
||||||
What version/OS are you on, literalPie? I can't reproduce this on macOS 12 with ToT WebKit. I am on macOS 11.5.1, and I am seeing the issue in * Safari Version 14.1.2 (16611.3.10.1.3) as well as * Safari Technology preview Release 128 (Safari 15.0, WebKit 16612.1.22.11.3) However, I just checked and I am _not_ seeing the issue in iOS 15 Beta 4, so maybe it is fixed in the beta OSes? I can't reproduce this either. I guess this should be marked as configuration changed. |
Created attachment 434620 [details] Icon in ::after pseudo element Safari has different behavior from other browsers when displaying an icon with a space in a ::after pseudo element. When there is an element with `::after { content: ' icon_name'}`, most browsers add a small space before the icon, but Safari adds a large space. This seems to only be the case when the icon font used has a "zero" character with a width (normally used for the "ch" unit).