Как сделать так, чтобы блок был выше :after?

Question

[1233211]

Вот так у меня получается label:after перекрывает span, как сделать так, чтобы текст из span был выше?

<label>
  <span>111</span>
<label>

label {
  display: block;
  background-color: black;
  position: relative;
}

label:after {
  content: "";
  position: absolute;
  width: 100%;
  top: 0;
  height: 100%;
  background-color: white;
  left: 0;
}

span {
  color: red;
}

Comments

[Алексей Уколов]

Уточните, выше по какой оси координат?

[1233211]

Выше, в смысле z-index выше. Спасибо, снизу уже ответили, нужно было position:relative прописать

Answer 1

[Арсений Матыцин]

span → position: relative + z-index: 1+
:after → z-index: 0

Answer 2

[Алексей Уколов]

label::after {
  top: 100%;
}

https://jsfiddle.net/alexey_m_ukolov/tLbe8yoc/1/