Почему в последнем браузере android chrome шкала css является неточной и как ее можно исправить? - PullRequest
Новая
       7

Почему в последнем браузере android chrome шкала css является неточной и как ее можно исправить?

0 голосов
/ 15 апреля 2020

codepen: https://codepen.io/DmitryGashko/pen/oNjjOVG

<div class="d1"></div>
<div class="d2"></div>

.d1,
.d2 {
  position: absolute;
  left: 10px;
  top: 10px
}

.d1 {
  width: 1px;
  height: 1px;
  background: red;
  transform: scale(300);
  transform-origin: 0 0;
}

.d2 {
  width: 300px;
  height: 300px;
  background: rgba(0,0,255,0.5);
}

Я тестировал его во многих различных браузерах на разных устройствах (через BrowserStack и на моих двух android телефонах) и все браузеры отображают эти блоки правильно (оба квадрата полностью пересекаются), но в последних android chrome масштабированный блок имеет больший размер.

Каждый браузер:

enter image description here

Последний android chrome:

enter image description here

Конечно, этот пример немного синтетический c, и мне это не нужно, но из-за этого в моем случае мало нежелательных уродливых пикселей.

...