I cannot replicate this issue in Chrome but can in Firefox:

Looks like links inside figures need to be display block.

This is a Firefox issue that goes back years. The blue box showing the focus is typically as wide as the image, but its height corresponds to one line of text. Setting the style declaration display:block; on the <img /> element works to make the blue box the same height as the image, and might be better than putting it on the a element, since some of the a elements might enclose text - for example, inside the thumb caption.

Also happens on links:

What does this have to do with the issue in question? And what even is supposed to be wrong with it?

ETA: It looks like only on Vector 2022, the outline appears even when clicked by mouse, not just when focused by Tab. But that still seems a totally different issue from this task.

In T368137#9928597, @Nardog wrote:

Also happens on links:

What does this have to do with the issue in question? And what even is supposed to be wrong with it?

Agreed, I think the task should clarify if the issue is the presence of a blue border at all or the size of the border on Firefox. I'm assuming it's mostly the latter, because that would be broken on focus and on click.

In T368137#9931841, @CCiufo-WMF wrote:

In T368137#9928597, @Nardog wrote:

Also happens on links:

What does this have to do with the issue in question? And what even is supposed to be wrong with it?

Agreed, I think the task should clarify if the issue is the presence of a blue border at all or the size of the border on Firefox. I'm assuming it's mostly the latter, because that would be broken on focus and on click.

The border is new, so, yes this is what we (the web team) are trying to understand.

The border is being applied by the Codex mixin .cdx-mixin-link-base so will likely need an update in Codex once we've reached that decision (either to remove it altogether or to better apply it in the case of img tags inside links).

@Jdlrobson do you know which task/patch introduced this change?

@CCiufo-WMF according to git blame it was cd44419c95c5f515865b89ce31b454c6c3e912f7 where Vector 2022 switched to cdx-mixin-link-base

Okay, and that was done to support dark mode as part of T366515. DST will take a look.

Per sync untagging web team. DST will take it from here.

I've filed T369223 to explore updating the behavior of Codex links applying a focus state on click, so I've updated this task to just be about the Firefox issue, which would continue to be present on keyboard navigation even if T369223 is implemented.

I'm assigning @Volker_E to investigate just this issue with Firefox, but there may not be anything we can do within Codex to address it.

As, @Redrose64 already wrote in T368137#9919265, the solution might be just to update the <img /> element to use display:block; where this is an issue.