尽管存在相对索引和Z索引，伪“ after”元素仍未显示

Question

我知道那里还有一些其他的帖子，这些帖子通常会声明诸如确保父对象是相对亲戚，添加z-index等内容，但没有一个起作用。有问题的元素是此页面上的搜索按钮：

https://notts-laod.verseonecloud.com/search

有什么想法吗？我只想知道伪元素的实际位置，因此可以在按钮上放置一个搜索图标。感谢您的帮助。具体代码为：

.submit-wrap input {
  padding: 12px;
  border: 1px solid #7A689C;
  position: relative;
}

.submit-wrap input:after {
  position: absolute;
  padding-left: 5px;
  font-family: 'Font Awesome 5 Pro';
  content: '\f002';
  font-size: 0.75em;
  right: 0;
  top: 0;
  color: red;
  width: 100%;
  height: 100%;
  background: green;
  content: 'test';
}

<span class="submit-wrap">
<input name="search" type="submit">
</span>