Javascript 当我给出缩放索引时，材质ui弹出、选择、菜单组合位置出错

我给我的html提供缩放索引，然后在材质ui弹出框之后，选择菜单组件，使用材质ui模态组件，位置出错

这是我的İndex.css

@media only screen and (max-width: 1500px) {
html{
    zoom:0.8
}}

我的Js

               <Popover
                anchorReference="anchorEl"
                open={Boolean(userMenu)}
                anchorEl={userMenu}
                onClose={userMenuClose}
                anchorOrigin={{
                    vertical: 'bottom',
                    horizontal: 'center'
                }}
                transformOrigin={{
                    vertical: 'top',
                    horizontal: 'center'
                }}
                action={refa}
                classes={{
                    paper: 'py-8'
                }}
            >
                <>
                    <MenuItem onClick={() => changeLanguage('tr')}>
                        <img src="/assets/images/flags/tr.png" alt="tr" 
                         className="flag mr-8" />
                        <ListItemText className="pl-0 " primary="TR" />
                    </MenuItem>
                    <MenuItem onClick={() => changeLanguage('en')}>
                        <img src="/assets/images/flags/en.png" alt="en" 
                         className="flag mr-8" />
                        <ListItemText className="pl-0" primary="EN" />
                    </MenuItem>
                </>
            </Popover>

changeLanguage（'tr'）}>
changeLanguage（'en'）}>

这才是应该的

但事实就是这样