Question

我试图在我的网站布局上将div放在另一个div后面。我不能使用＆＃34; position：absolute＆＃34;，所以我去了如此负的利润。一切顺利，直到我添加了我的过滤器。

这是我想要放在主要内容背景图像的div。

.tshowcase-background-profile {
    height:300px;
    width:100%;
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
     filter: blur(5px);
     background-image:url('MY IMAGE');
     background-size:cover;
     z-index: -50;
}

如果我删除所有过滤器，它可以正常工作。 div位于其他div的下方，其中包含内容。但是，只要我对其应用过滤器，它就会在内容的顶部显示。

我可以在Google Chrome Inspector中查看和取消选中过滤行，它实际上会从内容下方更改为内容......依此类推。

为什么？

我需要在背景模糊的背景下放置一个div，但不能使用绝对位置。

由于

编辑：JSFiddle Example of my issue 。尝试删除过滤器，然后点击＆＃34;运行＆＃34;，您将看到Youtube图标将显示在DIV顶部，如果过滤器处于打开状态，则会显示在下方。

Answer 1

如何使用position: relative？

https://jsfiddle.net/3v8a6qmy/

负边距和CSS过滤器

1 个答案: