Transform: Scale и Overflow: Hidden Issue в Chrome

при работе с CSS3 Transform: Scale, возникает особая проблема. Если родительский div имеет переполнение: применение скрытого и граничащего радиуса, масштабирование дочернего дева заставляет его выходить за рамки своего родителя. Использование преобразования: масштабируйте, чтобы увеличить изображение в Div. При переполнении: скрытые и границ-радиус установлены на родительском div, масштабированное изображение переполняет свои границы. CSS Transition решит проблему. Однако этот подход оказался неэффективным.

solution

решение этой проблемы заключается в применении Transform: transtatez (0) к элементу обертки. Это свойство CSS заставляет аппаратное ускорение, которое повышает производительность рендеринга и устраняет проблему переполнения.

почему он работает

с использованием Transform: translatez (0). Графический процессор, позволяющий браузеру использовать выделенные графические ресурсы для рендеринга. Это повышает эффективность и точность преобразований, предотвращая изображение переполнить свой контейнер.

] Для получения дополнительной информации об этом методе и последствиях для преобразования: Transtatez (0) см. В статье о предоставлении CSS. [[[0) см. &&&]