wswmsword / postcss-mobile-forever

一款 PostCSS 插件,将固定尺寸的视图转为可跟随宽度变化而等比例伸缩的视图。To adapt different displays by one mobile viewport.
https://wswmsword.github.io/examples/mobile-forever/vanilla/
MIT License
325 stars 19 forks source link

有个问题, 使用 vant-popup, 属性 是 bottom 的时候 在PC 端预览时不会 居中 #3

Closed AuYuHui closed 1 year ago

wswmsword commented 1 year ago

是弹出层的宽度占满屏幕了吗?

因为 vant 的 position: fixed; 和定位属性(如 bottom: 0; width: 100%;)是在不同选择器写的,插件是通过判断选择器中是否包含 position: fixed; 才会重新计算这个选择器里的定位属性,所以另一个 bottom 选择器没有重新计算。

在自己的项目里可以在选择器上面标注 /* root-containing-block */ 解决这种问题,但是 vant 这样的第三方库不方便改,我会在近期的版本添加一个参数,识别到参数里的选择器就重新计算定位属性。

方便的话截图看一下现在的效果。

AuYuHui commented 1 year ago

是的, 宽度占满屏幕了

https://tinify.cn/backend/opt/output/zk4k532gdvh9g18nt5y13gg604bqt0wg/Snipaste_2023-03-06_16-41-22.jpg

wswmsword commented 1 year ago

好,知道了,近期我会修复。GitHub 这个评论框支持直接复制粘贴图片🙂。

wswmsword commented 1 year ago

v2.3.3 加了个参数,rootContainingBlockSelectorList,传入需要当成 fixed 定位的选择器就可以了。

rootContainingBlockSelectorList