#html #css #google-chrome
#HTML #css #google-chrome
Вопрос:
Я использую Chrome 53.0.2785.143, и я столкнулся с проблемой рендеринга, которая, казалось, чаще возникала в моем приложении при использовании CSS transform scale.
Вот JSFiddle, который показывает проблему, попробуйте прокрутить весь путь вниз, в конце концов вы достигнете стадии, когда ничего не будет отображаться. В Firefox этот JSFiddle будет работать нормально.
HTML
<div class="content">
Rendering issue
...
...
(you need to repeat this ~75000 times)
</div>
CSS
.content {
background-color: white;
color: red;
width: 600px;
font-size: 100px;
}
Мне интересно, сталкивался ли кто-нибудь еще с этой проблемой и знает, как с ней справиться.
Комментарии:
1. Ну, воспроизведено в последней версии Chrome.
2. Firefox 49 также, похоже, требует времени для его рендеринга
3. Также, похоже, возникает в Edge (Microsoft EdgeHTML 14.14393). Это (img) то, о чем вы говорите?
4. Да, кажется, немного по-другому, но на самом деле это происходит и в Firefox, но по-другому
Ответ №1:
Я опубликовал эту проблему в Chromium, и они ответили, что этот пример достигает предела рисования. Ссылка на проблему
«Вычисленная высота в div равна 1.725e 07px, поэтому неудивительно, что мы прекращаем его рендеринг. Мы действительно отображаем что-то до 1.665e 07px.
Это WontFix. В какой-то момент нам нужно ограничить размер закрашенной области, и это кажется разумным «.