如何定位 Web 组件 wrt window？

Question

我正在使用聚合物设计一个弹出式 Web 组件。要求是我希望它正好位于浏览器的中心 window.

这是演示 link - https://jsbin.com/xupowov/edit?html,output

Web 组件似乎将直接父级作为 window 引用。

有没有办法像通常 position: fixed 那样在 window 中定位它？

Answer 1

如果您想相对于 window 大小定位事物，您没有使用 %，而是使用 wh 和 vh

看看这个

     .picker {
        border-radius: 4px;
        border: 2px solid silver;
        background: white;

        position: fixed;

        height: 50px;
        left: -10vw; 
        right:-10vw;
      }

https://jsbin.com/hugecuxebo/1/edit

现在它位于水平中心。