Как убрать эффект cursor:pointer на телефоне?

Question

[wakenby]

Прописываю:

.div-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 292px;
  height: 56px;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  letter-spacing: -0.02em;
  cursor: pointer; // Прописываю курсор
  background: #fd3b3b;
}

И на пк все работает шикарно, курсор при наведении меняется, но на телефоне и в адаптивном просмотре в браузере появляется странное выделение кнопки при клике:



Т.е кнопка при клике выделяется белым, так происходит на телефоне и в адаптивном просмотре в браузере. Если убрать cursor: pointer; то становиться все нормально.

Так-же заметил что все блоки у которых установлен cursor: pointer; выделяются белым:



Как можно избавиться от такого поведения?

Comments

[Rustam Bainazarov]

Это не из-за этого, а из-за-webkit-tap-highlight-color.

Answer 1

[Михаил]

-webkit-tap-highlight-color: transparent;