Граница для ссылки с типом «отправить» не исчезает в Chrome?

Question

все. Я потратил несколько часов на то, что должно быть очень простым, прежде чем понять, что хром был моей проблемой. По сути, я пытаюсь отформатировать ссылку типа «отправить», чтобы она больше не выглядела как кнопка. Мой CSS это:

a[type="submit"]:link,
a[type="submit"]:focus,
a[type="submit"]:visited,
a[type="submit"]:active {
  background: #fff;
  border: 0 !important;
  cursor: pointer;
  outline: none!important;
  display: block;
  padding: 0;
  margin: 0 auto;
  text-decoration: none;
  width: 100%;
  height: 100%;
}

<a href="#" name="set" type="submit" value="set">Text</a>

Странно, но в этом фрагменте кода все выглядит хорошо. Однако, когда я запускаю это в своем проекте, Chrome не удаляет границу вокруг ссылки, которая появляется, когда я устанавливаю тип «submit». Он успешно меняет цвет фона на белый. Вещи выглядят хорошо, когда открыты в Firefox. Есть ли способ обойти это в Chrome?

Answer 1

Вы, кажется, запутались между якорем и кнопкой

:visited и :link - это псевдоклассы CSS, обычно используемые для стилизации элемента привязки.

type="submit" для элемента кнопки. И хотя type можно установить для элемента привязки, оно будет только ...

укажите тип мультимедиа в виде типа MIME для связанного URL-адреса. Это чисто консультативный, без встроенной функциональности.

button[type="submit"],
button[type="submit"]:focus,
button[type="submit"]:active {
  background: #fff;
  border: 0 !important;
  cursor: pointer;
  outline: none!important;
  display: block;
  padding: 0;
  margin: 0 auto;
  text-decoration: none;
  width: 100%;
  height: 100%;
}

<button name="set" type="submit" value="set">Text</button>