删除元素占用的空间而不隐藏它

Question

我知道我可以使用visibility: hidden隐藏元素而不删除它占用的空间。我想要做的恰恰相反：我想渲染页面的其余部分，好像元素不在页面上，但保持元素可见。

我问的原因是因为我有一个居中的950px宽的布局，我想在屏幕的左侧添加一个小框。看起来有点像这样：

现在我有一个<div>，它将侧边框保存为950px页面包装器中的顶部元素，它也是<div>。在旁边框中，我已应用position: relative和left: -200px（框宽度）将其移到侧面，但这仍然让我将主要内容向下推。我正确地解决了这个问题吗？是否有合理的方法来移除旁边框留下的垂直空间？

Answer 1

只需使用position: absolute;即可。元素将不再是文档流的一部分，您可以将其相对于其最近的非static盟友定位的祖先进行定位。

Answer 2

位置相对仍将占据空间。尝试位置：绝对;它会将元素绝对放在其父元素内，但最重要的是它的所有兄弟元素。