FlexSlider - содержимое оверлей появляется после анимации

Question

У меня есть FlexSlider с полной шириной, в каждом слайде изображение и некоторый HTML-контент сверху.

<li> 
    <img src="http://placehold.it/350x150"> 
    <div class="box"></div> 
</li> 

Но по некоторым причинам содержимое HTML появляется только после анимации слайдов.

Вот JSFiddle: http://jsfiddle.net/39wPU/1/

Я думаю, это может иметь что-то делать со свойством переполнения на DIV с классом «Flex-видовом». Если вы отключите его, проблема исчезнет (но возникает другая - т. Е. С очень большим горизонтальным переполнением).

Проблема возвращается всякий раз, когда вы помещаете переполнение: скрытый на любом содержащем элемент.

Что мне здесь не хватает?

ОБНОВЛЕНИЕ: Кажется, проблема возникает только в Chrome. Safari и Firefox в порядке.

Answer 1

Добавьте следующую строку в ваш .box селектор:

-webkit-backface-visibility: hidden; 
     backface-visibility: hidden;