Blazor После нажатия на кнопку изображения изображение имеет рамку

Question

Я создаю пример проекта для одного из моих пакетов Blazor Nuget и столкнулся с проблемой, которую обычно вижу только в Windows проектах типа Forms.

После нажатия кнопки со стрелкой кнопка имеет граница:

В мире форм Windows я бы сфокусировался на внеэкранном текстовом поле или элементе управления.

Если после щелчка есть настройка CSS, может быть, это поможет, или если кто-то знает способ убрать фокус с кнопки?

Моя кнопка просто простая кнопка:

<button class="nextbutton" @onclick="NextButton_Click"></button>

и css для следующей кнопки:

.nextbutton 
{
    display: inline-block;
    border: none;
    width: 52px;
    height: 64px;
    background-image: url('../images/buttons/bluearrowright.png');
    background-color: transparent;
    transform: scale(0.75);
    transform-origin: left;
}

Заранее спасибо, если есть трюк CSS или способ просто установить фокус на что-то за кадром я был бы в порядке, если бы вы показали мне JavaScript.

Answer 1

Вот источник моего ответа. Я уже проголосовал здесь.

Как убрать фокус с кнопок при нажатии

.nextbutton:focus 
{
  outline: none;
}

Я выполнил поиск до публикации, но я искал больше, пока ждал ответ и нашел вышеупомянутый пост. Работал отлично.