Firefox добавляет странные углы на фокус на контент внутри тега привязки

Question

https://jsfiddle.net/cvjz1hoe/14/

<div>
  <a href="http://google.com">
    <div>
      <h2>Data</h2>
    </div>
  </a>
</div>

Если у меня есть содержимое в теге внутри тега привязки, когда я фокусируюсь на нем, мой контур имеет странные угловые расширения контура.Не видел такого поведения в других браузерах

Answer 1

Вместо того, чтобы иметь свой тег привязки вне элемента заголовка, я рекомендую вам поместить тег привязки внутри элемента заголовка.Таким образом вы избежите этих странных поворотов в Firefox.

<h2>
  <a href="http://google.com">Data</a>
</h2>