В Chrome: активное состояние переключателя не сбрасывается при включении (клавиша пробела)

Question

Как показано в , это jsbin Я могу оформить ярлык переключателя с псевдоселектором :active.Но когда я активирую переключатель с помощью клавиши «пробел», в отличие от щелчка мыши, активное состояние впоследствии не сбрасывается.

Кто-нибудь может мне это объяснить?Похоже, что Firefox и Edge обрабатывают его по-разному.

body {
  font-family: sans-serif;
}
  
input:active + label {
  background-color: red;
}

<p>When a radio button in this group is :active the label background is red.</p>
  
  <p>Works as expected when clicking (the radio button gets "deactivated" again when the mouse button is released).</p>
  
  <p>But if I activate a radio button with the keyboard, key [Space], it <i>isn't</i> deactivated on key up. I can then move to another radio button with the arrow keys (= that button is checked).</p>
  
  <p>Again, I can hit [Space] and now I have <i>two</i> radio buttons in active state.</p>
  
  <p>If I use the arrow keys to navigate to one of these active radio buttons, <i>then</i> it gets deactivated.</p>
  
    <input type="radio" id="huey" name="drone" value="huey" checked>
    <label for="huey">Huey</label>

    <input type="radio" id="dewey" name="drone" value="dewey">
    <label for="dewey">Dewey</label>

    <input type="radio" id="louie" name="drone" value="louie">
    <label for="louie">Louie</label>

  <p><br>Another group with only one button – same issue:</p>
  
    <input type="radio" id="jonna" name="jonne" value="jonna">
    <label for="jonna">Jonna</label>