1508066 - text-transform: capitalize does not work on some <a> tag

Status: RESOLVED INVALID

(Core :: Layout: Text and Fonts, defect)

Description

[[e-mail]]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:63.0) Gecko/20100101 Firefox/63.0

Steps to reproduce:

It's hard to reproduce with basically any kind of reduced test case in general. But the said issue is happening on my personal website. It's a strange behavior that one of the <a> tags is not capitalized.

1. Head over to https://motss.app/
2. `blog` right below the header is not capitalized.
3. Open DevTools and inspect the text `blog` and you will find that it is an <a> element with `text-transform` set to `capitalize`.


Actual results:

Texts inside some <a> tag are not capitalized.


Expected results:

Texts inside <a> tag should be capitalized by setting `text-transform: capitalize;`.

Comment 1

[Emilio Cobos Álvarez (:emilio)]

Even if it's not reduced, a standalone HTML file attached to the bug would be really appreciated if possible.

Thanks for the report!

Comment 2

[Emilio Cobos Álvarez (:emilio)]

Attachment: Reduced testcase.

I think this is a Chrome / WebKit bug. If you remove the pseudo-element they don't capitalize either.

There's no whitespace between the two links, so they're really the same word. In your app there's just an artificial margin / padding between them.

Comment 3

[Emilio Cobos Álvarez (:emilio)]

(Or if you make the pseudo-element an inline for that matter.)

Comment 4

[Emilio Cobos Álvarez (:emilio)]

I filed https://bugs.chromium.org/p/chromium/issues/detail?id=906369 / https://bugs.webkit.org/show_bug.cgi?id=191807.