1

I have one strange bug on my website. When i trying to transform block with text by using

transform: translateY(0px) translate3d(0,0,0) translateZ(0);

i got this block but with black (or white) stripes behind the text. I suppose in depends what background is - light or dark. I can't attach the screenshot for example, so i leave a link. Animated blocks - text block that appeared when you scroll the page. This animation perfectly work in all browsers, but not in Firefox (windows ver.). Maybe someone saw this and could help... Thanks!

2 Answers 2

5

I solved my problem by setting

outline: 1px solid transparent; 

property for each animated block on the page. It was helpful. I found this solution in this answer.

0

This might be a result of a bug that I have encountered. There are still quite a few of optimization problems when it comes to transitions, in any browser, but particularly Firefox.

Have you tried setting perspective: 1000; to the parent element? It's served as a quick fix to some of these problems.

Nice website, by the way!

1
  • thanks for solution example. But i did not tried it. I solved this problem by setting outline: 1px solid transparent; property for the animated block... Jan 12, 2015 at 10:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.