Html 让div与svg重叠

我试图在网站的页脚中有许多div与SVG文件重叠。但是，div没有与SVG文件重叠，只是出现在文件的下面。我试着把

position:absolute

放在div上，通过

margin

移动东西，但它们仍然没有重叠。下面是一个代码示例

.footer svg{
高度：自动；
宽度：100%；
最大宽度：100%；
位置：相对位置；
z指数：-5；
}
.网站页脚{
位置：相对位置；
a{
颜色：蓝色；
文字装饰：无；
}
}
.社交页脚导航{
保险商实验室{
///显示器：flex；
列表样式类型：无；
保证金：0；
}
}
.页脚导航{
保险商实验室{
///显示器：flex；
列表样式类型：无；
保证金：0；
}
}
.自定义页脚徽标{
最大宽度：200px；
}
.footer网格容器{
位置：绝对位置；
边缘底部：50px；
}

">
如果我正确理解你的情况，这可能是使用错误的CSS规则来放置绝对位置div的例子。考虑使用“顶部”和/或“右”CSS规则如下所示，以实现所需的位置：


.footer svg{
高度：自动；
宽度：100%；
最大宽度：100%；
位置：相对位置；
z指数：-5；
}
.网站页脚{
位置：相对位置；
a{
颜色：蓝色；
文字装饰：无；
}
}
.社交页脚导航{
保险商实验室{
///显示器：flex；
列表样式类型：无；
保证金：0；
}
}
.页脚导航{
保险商实验室{
///显示器：flex；
列表样式类型：无；
保证金：0；
}
}
.自定义页脚徽标{
最大宽度：200px；
}
.footer网格容器{
位置：绝对位置；
/*实现绝对容器的更可预测放置
按顶部、左侧、右侧、底部而不是边距*/
顶部：500px；
/*使绝对定位的div在整个方向上拉伸
在屏幕上，使用值设置左侧和右侧。这些值可以是
如果希望从任意一侧略微插入，则为非零*/
左：0px；
右：0px；
}

">
谢谢您的帮助！这种做法奏效了，我认为这比保证金更合适。唯一的问题是，当我将
位置：absolute
放在.footer网格容器上，然后将其四处移动时，我尝试移动的各个框会折叠。如果可能的话，我把代码推到了一个实时代码库上。我不确定我是否理解您现在想要实现的目标-您是否在0px中使用了“顶部”和“右侧”规则？很抱歉-没有在dev上应用更新。我已经使用
top:500px
正确定位了内容，并且它们按照需要正确重叠svg。现在唯一的问题是我使用它时容器的宽度。如果为.footer网格容器打开和关闭
position:absolute
，您可以看到容器的宽度是如何变化的。有没有想过为什么会这样？没问题！我想我现在明白你的问题了——有一个技巧可以解决这个问题。看到我更新的答案：-）就是这样！非常感谢！