How to smooth the edges of a div when applying the transform property on it in firefox?

Question

Mozilla Firefox

I apply the transform property on the div. Browsers on webkit are fine.

But in firefox, the edges are not anti-aliased at all and look just awful.

I read that you can try box shadow or blur. It didn't work with box shadow, and blur completely cancels the work of transform-style: preserve-3d. So that's not an option either. Are there any other options?

Answer 1

The question is very old, but maybe the answer will be useful to someone from the search:
box-shadow - it will help, but you need to choose the right property parameters