CSS3 3D 변환과 함께 발생하는 가로 오버플로

Question

http://mr.si/에 CSS3 3D 변형과 관련된 문제가 있습니다. 나는 재미있게 그것을하고 있으며 새로운 CSS 기능을 탐구하지만 그것은 나를 방해한다.

문제는 행의 마지막 두 항목 위로 마우스를 가져갈 때 발생합니다. 추가로 원하지 않는 결과가 발생하면 원하지 않는 일이 발생합니다. 요소가 수평으로 극단적으로 넘치고 수평 스크롤 막대가 나타나면 전혀 좋지 않습니다.

웹킷 버그일지도 모르지만 최신 Chrome 개발자 빌드와 Safari 5에서 발생하는 버그 일 수 있습니다.

내가 뭘 잘못했는지 알 수 있습니까?

편집 :이 더 이상 관련이없는, 그래서 내가 사이트를 변경 협조 할 :

Answer 1

는 당신에게 당신의 문제는 나를 깜짝 놀라게 왼쪽 진실을 말하려면 P, 그것은 나에게 브라우저 벌레처럼 보인다.

그러나, 나는 간단한 수정 발견

#main section { 
overflow: hidden; 
// the rest of your css declarations 
} 

그것은 이상한 물건을 왜의 통찰력보다 패치의 더를,하지만 난 그게 도움이되기를 바랍니다.

건배!

편집 :와 ....

header[role="banner"], #main, #main + footer { 
    overflow: hidden; 
    padding: 0 20px; 
    //yourcode 
}