Webkit не учитывает переполнение :скрыто с радиусом границы
У меня есть прекрасная анимация Star Trek Red Alert с использованием CSS3. Один из моих родительских элементов имеет border-radiusвместе с overflow:hidden, так что любое содержимое обрезается до формы радиуса границы.
Все это отлично работает в Firefox, но браузеры Webkit оставляют некоторые дочерние элементы за пределами обрезанной области.
Вот мой код:
http://jsfiddle.net/doublewombat/EqK6R/embedded/result/
divс именем класса curvedEdgesимеет border-radiusи overflow:hidden. Однако блоки слева и справа от текста «Предупреждение» выходят за пределы этого радиуса, даже если они являются дочерними элементами curvedEdges. Или, говоря простым языком, левый и правый края анимации должны быть слегка изогнутыми (, как в Firefox ), а не абсолютно прямыми.
Так это ошибка в Webkit, или я что-то не так делаю?
Вот это на YouTube, если у вас нет под рукой браузера Webkit...