Кнопка ввода начальной загрузки не отображается с цветом

Question

Я хочу добавить значок шрифта рядом с моей кнопкой input.

Итак, я нашел этот ответ , и только вариант 1 применим к моему варианту использования, так как мне нужно отправить форму для удаления хранилища.

Но кнопка input не соответствует цвету тега span.

Я пытался добавить класс btn-danger в тег input, но у него есть тень.

https://jsfiddle.net/coolwei/4osuyrk5/6/

То, чего я хочу добиться, - это постоянный цвет и размер кнопки с помощью кнопок View и Add.

Answer 1

Я не уверен, почему вы вкладываете button в a здесь.

<a href="#">
  <button type="button" class="btn btn-success mr-1">
  <i class="fas fa-user-plus"></i>
  Add Student
  </button>
</a>

Для кнопки отправки вам нужно использовать тег button со свойством type="submit".

<button type="submit" class="btn btn-danger">
  <i class="far fa-trash-alt"></i>
  Delete
</button>

Answer 2

Прежде всего, вы должны использовать тег <button>.

Однако, если вам действительно нужно сделать это таким образом, вы должны очистить стили ввода по умолчанию, например:

.clear-input {
  background: none;
  color: inherit;
  padding: 0;
  border: 0;
}

И добавьте этот класс к вашему вводу

<input class="clear-input" type="submit" value="Delete">

https://jsfiddle.net/2vdabphn/