3D CSS 변환: Firefox의 들쭉날쭉한 가장자리 처리

Chrome CSS 변환의 들쭉날쭉한 가장자리 문제와 동시에 비슷한 문제가 발생합니다. 3D 변환 중 Firefox를 사용합니다. 그림은 다음 JSFiddle(Firefox 관련)에서 찾을 수 있습니다. http://jsfiddle.net/78dK/5/.

Chrome과 달리 backface-visibility는 Firefox에서 솔루션을 제공하지 않습니다.

해결 방법:

해결 방법 1(개요 속성):

보다 보편적인 솔루션을 위해서는 투명한 개요 속성을 추가하는 것이 좋습니다.

outline: 1px solid transparent;

이 접근 방식은 Firefox 10.0.2 Windows 7: http://jsfiddle.net/nKhr8/.

해결 방법 2(테두리 속성):

또는 배경과 일치하는 색상으로 테두리 속성을 추가할 수 있습니다.

border: 1px solid white;

이 옵션은 배경색이 알려진 경우에 효과적입니다(예: 이 경우 흰색): http://jsfiddle.net/LPEFC/.