el-popover通过transform缩小后位置发生偏移

el-popover也通过popper-class设置 transform: scale(0.5, 0.5),但是设置后会发生位置偏移,请问要怎样解决?
image.png

阅读 7.7k
4 个回答

margin-right:-20px

解决了吗2222

想出一种方法,试试看~

  1. 通过JS设值CSS变量-全局缩放值:

    document.documentElement.style.setProperty('--app-scale', scale);
  2. 定义CSS变量

     :root {
       --app-scale: 1;
     }
  3. 对所有的弹窗应用动态缩放样式

    body .el-message-box__wrapper .el-message-box, body .el-select-dropdown, body .el-dropdown-menu, body .el-popover {
      transform: scale(var(--app-scale));
    }
新手上路,请多包涵

因为el-popover自己有定位:transform: translate(612px, -155px)样式,而我们添加的:transform: scale(2),会覆盖定位的translate。所以你OK了吗,我也有这个问题?

我使用zoom: 200%;放大2倍,也还是会发生位置偏移。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏