대각선으로 대치하는 두 개의 css scalene 삼각형 사이의 선을 제거하는 방법은 무엇입니까?

Question

내가 사용하고 있습니다 :

왼쪽 아래 삼각형

width: 0px; 
height: 0px; 
border-style: solid; 
border-width: 317px 0 0 512px; 
border-color: transparent transparent transparent #007bff; 

오른쪽 상단 :

http://apps.eky.hk/css-triangle-generator/

반대 대각선으로 서로 배치되는 두 부등변 삼각형에 대한 CSS를 생성하는 삼각형

012 하지만이 테스트 jsFiddle에서

width: 0px; 
height: 0px; 
border-style: solid; 
border-width: 0 0 317px 512px; 
border-color: transparent transparent #007bff transparent; 

3,516,은 두 개의 삼각형 사이에 선이나 간격을있을 것 같습니다 나는 그것을 제거 할 수 없었던 :

http://jsfiddle.net/rwone/MB5Lt/4/

편집

솔루션 컨테이너가 512px에도 불구하고, 두 삼각형 514px의 폭을하게 될 것으로 보인다.

Answer 1

한 용액 (이 경우에 #007bff) 삼각형을 한 테두리 색상과 동일한 값을 갖는 배경 색상을 제공하는 것이다. 그런 다음 자바 스크립트 함수에서 애니메이션을 시작하기 전에 배경색을 빠르게 제거하십시오.

Updated fiddle.