initial-letter fails to exclude text around glyph bounding box

• Component: CSS
• Status: RESOLVED CONFIGURATION CHANGED

[Dave Cramer]

Created attachment 258888 [details]
HTML file showing crash between italic initial letter and subsequent text.

If an initial letter is created using a glyph that extends beyond the em box, the initial letter may overlap document text. The spec says, "Text is therefore excluded around the glyph bounding boxes of the initial letters." [1] 

Testing with an italic initial letter can sometimes show this problem (test file attached). Some fonts (especially script fonts like Zapfino which may have negative side bearing) are also good test candidates. 

Dave

[1] https://drafts.csswg.org/css-inline/#initial-letter-exclusions

[Radar WebKit Bug Importer]

<rdar://problem/22901550>

[Ahmad Saleem]

If from above attached test case, I remove -webkit- then all browsers behave same but if I keep -webkit- then "J" initial letter is big italic and remaining characters 'udge' touches "J".

-webkit- removed JSFiddle - https://jsfiddle.net/5wsq6han/show/

I followed MDN article and also changed the size in fraction from 5 to 5.0 and then also added back -webkit-:

Link - https://jsfiddle.net/ohcuv580/show

But Safari and all other browser still differ, other browser don't support "initial-letter" as per - https://developer.mozilla.org/en-US/docs/Web/CSS/initial-letter

We are trying to aligning with any web-spec? Since other browsers don't even support it. Just wanted to to share update. Thanks!

[Ryosuke Niwa]

I think this is config changed given the unprefixed version behaves correctly with other browsers.