Html 如何强制分隔器的位置，并将徽标放置在特定位置？

以下是我现在拥有的：

我正在努力将我的分隔符和书向上移动，可能是10像素

我尝试使用dev工具检查它们，并调整

填充

和

边距

，但似乎没有任何效果

我现在很好奇也很无知。 我不知道为什么它会在橙色的虚线处阻止我。 我需要推一下这里

有人能告诉我我做错了什么吗

---

这是我的实时结果：

要将所有内容移动到穿孔线下方，请更改

.tl左

选择器的margin top属性

.tl-left{
    margin-top: -35px;
}

要仅移动书本图像和垂直线，请执行以下操作：

#mp-book{
    width: 76px;
    margin-top:-10px;
}

.vertical-line {
    border-left:3px solid silver;
    height:100px;
    text-align: center;
    width:2px;
    margin-left:48px;
    margin-right:25px;
    margin-top:-10px;
}

将

页边距顶部：-10px

添加到

#mp book

和

中。垂直线

选择器

---

对不起，它坏了！你自己试试吧！你看到了什么？它将橙色穿孔线下的所有东西（在你的图像中）移向h2元素。你读过我的描述吗？我只想移动我的分隔符和我的图像徽标，而不是全部。你能把你的解决方案/建议放在我的小提琴中，更新我的小提琴，并将小提琴链接作为你答案的一部分吗？