Это что, хромированная ошибка?
Может ли кто-нибудь подтвердить, что "getBoundingClientRect" имеет ошибку Chrome?
<!DOCTYPE html>
<html>
<head>
<style>
body {
margin: 0;
}
.main {
width: 200px;
height: 200px;
background-color: gray;
padding: 20px;
}
#box {
width: 100px;
height: 100px;
zoom: 10%;
background-color: red;
}
</style>
</head>
<body>
<div class="main">
<div id="box">box</div>
</div>
<script>
console.log(document.getElementById('box').getBoundingClientRect());
document.write(`<p>left: ${document.getElementById('box').getBoundingClientRect().left}</p>`);
// left and top should be 20, but they are 200. They are divided by element's "zoom" attribute.
</script>
</body>
</html>
Что я уже пробовал:
Я получаю разные результаты для Chrome и Edge, и я понимаю, что Chrome ошибается.
Edge возвращает 20, Chrome-200.