为什么我的span元素没有出现在标题上？

Question

我正在尝试使用普通CSS在页面上绘制其他（模拟）按钮，但是我的progress元素未显示。我尝试过给它span，也尝试过绝对放置它，但是似乎没有任何效果。在这两种方式中，哪种是首选/最清晰的方法？

display: block;

header {
   position: relative;
   display: flex;
   justify-content: space-around;
   border-bottom: 6px solid black;
   padding: 15px 0 10px 0;
}

   img {
     width: 43px;
     height: 43px;
   }

   .red-button {
     background: yellow;
     width: 50px;
     height: 50px;
   }
 

 header:before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 74px; 
  width: 100%;
  border-bottom: 6px solid maroon;
 }

 header:after {
   content: "";
   position: absolute;
   top: 0;
   width: 100%;
   border-bottom: 6px solid $light-red;
 }

Answer 1

只需尝试将className替换为class。