Transform + overflow: hiiden = размытый контент?

Question

[Alibek Kulseitov]

всем привет!
Проблема такая: при скрещивании 3д трансформации и overflow: hidden контент в диве размывается.
Как это исправить?
Гуглил и искал разные решения типа
-webkit-font-smoothing: subpixel-antialiased;
-webkit-transform: translate3d(0,0,0);
и тому подобных.
Ничего не помогло.

Вот собственно сам сайт: kulseitov.kz/relog/#steps

К блоку с ID="steps" применен overflow: hidden;

Answer 1

[Андрей Никифоров]

Чтот сайта не видно, а если задать overflow для родителя этого блока с такой же шириной и длиной ?

Comments

[Alibek Kulseitov]

Ссылку прикрепил) Дело не в длине и не в ширине)

Answer 2

[Артем]

Уберите лишнее skew (у вас они на каждом диве). Оставьте только на "steps-content" и на "li" и все четким станет.

Comments

[Alibek Kulseitov]

Так мне же нужно сохранить дизайн. То что вам весь блок #steps кривой а потом эти три колонки кривыми должны быть.

[Alibek Kulseitov]

Артем проблема даже не в самом блоке #steps. Вот возьмите тот же блок kulseitov.kz/relog/#video-block там тоже все размыто

[Артем]

задайте skew соседним section. В этом у вас переизбыток skew (нужно поменять подход).

Answer 3

[Alex]

В гугле это известный баг с 100500 тем на stackoverflow

например:

stackoverflow.com/questions/23871507/css-transform...

Comments

[Alibek Kulseitov]

не помогает

[Alibek Kulseitov]

Alex все этим темы перепробовал