CSS相对位置作为绝对位置

我很难使div的顶部位置相对于它之前的副作用

我有：

<style>
#container {position:absolute; top:0px; height:100%}
.question {position:relative;border: 1px double black;}
.question [scope=title] {position:relative; top:0px; color:black;font-size:28px; border-bottom: 1px double black;}
.question [scope=body] {position:relative; top:0px; color:black;font-size:18px; }
.question [scope=author] {position:relative;top:10px}
.question [scope=tags] {position:relative;top:0px}
</style>

#容器{位置：绝对；顶部：0px；高度：100%}
.问题{位置：相对；边框：1px双黑；}
.question[scope=title]{位置：相对；顶部：0px；颜色：黑色；字体大小：28px；边框底部：1px双黑；}
.question[scope=body]{位置：相对；顶部：0px；颜色：黑色；字体大小：18px；}
.问题[范围=作者]{位置：相对；顶部：10px}
.question[scope=tags]{position:relative；top:0px}

然后

    <div ID="container">
        <div class="question">
            <div scope="title">A</div>
            <div scope="body">B</div>
            <div scope="author">C</b></div>
            <div scope="tags">D</div>
        </div>
</div>

A.
B
C
D

我预计author div将比正常情况下低10px，并且下面的div将与此相关。但是，“标记”和“作者”重叠

---

如此令人恼火，但我敢打赌有一个简单的答案。有什么帮助吗？

因为您的

问题

元素正在计算到子元素的高度。 所以它的高度和孩子们的确切高度是一致的，但是其中一个孩子（C）你把它往下推10px，所以它和下面的那个重叠

只要更改

作者

，它就可以工作了

.question [scope=author] {position:relative;top:0px}

---

因为您的

问题

元素正在计算子元素的高度。 所以它的高度和孩子们的确切高度是一致的，但是其中一个孩子（C）你把它往下推10px，所以它和下面的那个重叠

只要更改

作者

，它就可以工作了

.question [scope=author] {position:relative;top:0px}

---

请尝试在作者身上设置页边空白：

.question [scope=author] {position:relative;margin-top:10px}

---

请尝试在作者身上设置页边空白：

.question [scope=author] {position:relative;margin-top:10px}

---

当一个图元具有“位置：相对偏移”时，该图元将以偏移进行渲染，但其他图元将放置在布局流中，就像该图元没有偏移一样。换句话说，偏移发生在布局流之外。它就像一个绝对定位的元素，在布局中有一个不可见的占位符为它占据空间

---

由于您希望元素响应彼此的偏移，因此建议使用不同的偏移机制，即在布局流中发生的偏移：填充或边距。

当一个元素具有位置：相对偏移时，该元素在偏移处渲染，但是其他元素被放置在布局流中，就好像该元素没有偏移一样。换句话说，偏移发生在布局流之外。它就像一个绝对定位的元素，在布局中有一个不可见的占位符为它占据空间

---

由于您希望元素响应彼此的偏移，因此建议使用不同的偏移机制，即在布局流中发生的偏移机制：填充或边距。

在作者分区中有一个粗体的结束标记。。。（？）不会影响CSS，浏览器编译器只会忽略一个松散的结束标记。这是我在删除代码时犯的一个错误，目的是让你们这些善良的人更容易理解。愚蠢的Me你在作者部分有一个粗体的结束标记。。。（？）不会影响CSS，浏览器编译器只会忽略一个松散的结束标记。这是我在删除代码时犯的一个错误，目的是让你们这些善良的人更容易理解。愚蠢的我，但我希望作者比“香草”低10像素。问题是如何使下面的同级div与其前面的同级div相对？然后使用

填充

或

边距

。但我希望author比“vanilla”低10px。问题是如何使下面的同级div与其前面的同级div相对？然后使用

padding

或

margin

。