Html 将内容放在其父元素的下面

我想将

页面：之后的
中的内容放在
页面的下方
。我使用了负z指数，但没有任何变化。在下图中，图标之间的线条应位于每个图标的下方。有人能帮我吗



正文{
边缘顶部：50px；
}
.页{
宽度：100%；
}
.第页{
显示：内联块；
宽度：30%；
文本对齐：居中；
位置：相对位置；
字体大小：30px；
}
.第页：之后{
内容：''；
宽度：100%；
高度：2倍；
背景：#000；
位置：绝对位置；
最高：50%；
左-50%；
z指数：-1；
}
.页码：第一个孩子：之后{
内容：无；
}








您可以将顶部更改为
顶部：1.5em


.pages{
宽度：100%；
}
.第页{
显示：内联块；
宽度：30%；
文本对齐：居中；
位置：相对位置；
字体大小：30px；
边缘底部：10px；
}
.第页：之后{
内容：''；
宽度：100%；
高度：2倍；
背景：黑色；
位置：绝对位置；
顶部：1.5em；
左-50%；
}
.页码：第一个孩子：之后{
内容：无；
}










这解决了问题
而不是放置
：在
.page
上的
之后，将其放置在
.fa
（图标）上

变化：

 .page {
    left: 2px;
  }

  .fa:after {
    content: '';
    width: 100%;
    height: 2px;
    background: #000;
    position: absolute;
    display: inline;
    top: 50%;
    left: -50%;
    z-index: -1;
  }

一小条

.pages{
宽度：100%；
}
.第页{
显示：内联块；
宽度：30%；
文本对齐：居中；
位置：相对位置；
字体大小：30px；
左：2px；
}
英足总：之后{
内容：''；
宽度：100%；
高度：2倍；
背景：#000；
位置：绝对位置；
显示：内联；
最高：50%；
左-50%；
z指数：-1；
}








您需要将图标设置在位置：相对；如果需要，最终添加z索引：添加一种不同的颜色，使其清晰可见。无论我看了多少次，它都在它下面。这甚至不会影响任何东西。根据其他评论，它实际上在下面。所以lookCode的问题在于，只有答案被认为是堆栈溢出上的低质量内容。请添加一些说明，说明为什么会回答此问题。
 .page {
    left: 2px;
  }

  .fa:after {
    content: '';
    width: 100%;
    height: 2px;
    background: #000;
    position: absolute;
    display: inline;
    top: 50%;
    left: -50%;
    z-index: -1;
  }