CSS `::first-line` Not Respecting `letter-spacing` in Nested `a` Tag

Consider the following simple example:

::first-line {
  font-variant   : small-caps;
  letter-spacing : 0.08em;
}

<p class="fancy">
  Lorem ipsum
  <a href="">dolor sit</a>
  amet, consectetur adipiscing elit, sed do eiusmod.
</p>

which renders like so (Firefox; similar rendering in Chrome):

The problem is that the letter-spacing property is not being respected in the a element. Whereas, the docs specifically say it should be:

Applies to all elements. It also applies to ::first-letter and ::first-line.

Notice that the font-variant is being respected, so I know that the browser is smart enough to recognize that the a element is in the first-line.

How can I make letter-spacing also be respected?

Note: some experimentation shows that some other nested tags (e.g. b, abbr) don't suffer the same problem, and href must be present to cause the problem for a. Weirdly, hovering or selecting the offending text sometimes fixes (or causes) it, and then unhovering / unselecting sometimes causes or fixes it back; the behavior does not seem reliable.

I don’t see that issue in either Chrome or Safari on Mac ... only in Firefox. I’d say it’s a bug, and would encourage you to report it on Bugzilla. A workaround is to add a class to any anchors likely to appear in the first line, and apply the letter spacing via the class, as per the snippet below.

.fancy::first-line, a.fancy {
  font-variant   : small-caps;
  letter-spacing : 0.08em;
}

<p class="fancy">Lorem ipsum <a class="fancy" href="https://google.com">dolor sit</a>
amet, consectetur adipiscing elit. Maecenas tempor nunc mauris, sit amet placerat tortor lobortis dapibus. Nam lectus eros, maximus ac magna vel, congue consequat eros. Fusce id pretium diam. Cras sit amet pharetra ante. Sed quis commodo quam, vel facilisis ipsum. Vestibulum sodales iaculis arcu, et fringilla nisi ullamcorper sed. Donec interdum sit amet est non accumsan. Donec non augue feugiat, fermentum nunc non, convallis est. Cras vel ligula nec odio faucibus ultricies. Sed vulputate tortor eget pretium convallis. Cras interdum elit eget mi porta suscipit. Morbi ut velit diam. Etiam finibus eros et efficitur rutrum. Quisque viverra metus ac eleifend imperdiet. Quisque pretium ut purus vitae tempus. Duis varius risus congue velit faucibus, sed interdum purus consectetur.</p>

Note also that when running your snippet in Safari, the text inside the anchor is not rendered in small caps, but when I use .fancy::first-line rather than just ::first-line, this issue is resolved. You can report WebKit (Safari) bugs here.