css - 多个框阴影在 MSEdge 中不起作用

Question

添加多个框阴影部分起作用。虽然阴影在所有浏览器中都出现在框的左侧和右侧，但它不会出现在 MSEdge 的左侧。

我尝试添加 border-collapse: seperate, display: block 和 inline-block, background-color: rgba(255,255,255,1) 但这些似乎都不起作用。感谢您的帮助。

{
    width: auto;
    border: none;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);
    border-radius: 2px;
}

阴影也应该出现在 MSEdge 的左侧。

Answer 1

这里的问题与任何测试环境(VirtualBox、browserstack、sauce labs 等)中的像素密度有关。影子仍然无处不在，但它只是没有出现在测试环境中。在实际浏览器中进行测试可提供所需的输出。不确定是什么原因造成的，但这是任何虚拟机上的镜像的问题。