问题已解决，原因为translate、rotate属性各端适配不同，详情见下方评论。
-------------------------------分割线-----------------------------------------------------
我个人使用uniapp框架开发的微信小程序（开源地址：Github仓库）出现开发者工具中显示正常，iOS端也基本正常（除了动画有点闪动），而安卓端（测试机型：红米Note8、小米11Ultra）则其中的sa-menu组件出现显示错位（见下图），sa-area组件出现点击判定错位的情况。
已尝试：
- 修改sa-menu组件中动态调整的各个尺寸变量为静态的px单位变量；
- 移除sa-menu组件中transition属性；
均无法解决问题，且无任何变化
已排查出问题所在，为translate、rotate、scale这些变换函数必须放在transform属性中使用，否则会出现在微信PC端、微信安卓端、某些浏览器中（例如安卓端chrome浏览器）不生效的情况。
详情可见个人博客文章：小程序开发务必使用transform包裹translate、rotate、scale属性
看数字和+-，感觉是字体问题，导致父级元素宽高不同，中间的元素旋转没有以中心点旋转导致错位
用图片代替文字应该就能解决