IE에서 jQuery UI draggable 봉쇄 버그

Question

사용자가 특정 셀을 드래그하여 & 드롭을 통해 선택할 수 있어야하는 셀 그리드를 구현해야합니다. 열과 행의 수는 미리 정의되어 있으며 (45 x 30 셀) 셀은 정사각형이어야합니다. 그리드는 반응 형 트위터 부트 스트랩 레이아웃 (유체 행)에 배치되어야합니다.

제가 사용 jQuery를 UI의 draggable과 유체 범위 안에 <section> 인 봉쇄 지정 :

<div class="container-fluid"> 
    <div class="row-fluid"> 
     <div class="span3"> 
      ... sidebar 
     </div> 
     <div class="span9"> 
      <section id="grid"></section> 
     </div> 
    </div> 
</div> 

문제는 단지 IE에 드래그 요소 ((원경 전용 버전 11 시험)이다 jQuery를 통해 생성되고 왼쪽 상단에서 시작하여 예를 들어 2x2 셀의 크기를 가짐) 주위를 드래그 할 수 있지만 왼쪽 상단 구석으로 다시 드래그하려고하면 컨테이너가 엉망이되어 드래그 할 수 없습니다. 더 이상 봉쇄의 가장자리까지.

문제점을 나타내는 JSFiddle을 설치합니다 (http://jsfiddle.net/e2yfC/307/).

모든 추가 자바 스크립트 코드를 정리하여 읽기 쉽습니다. 보시다시피 그리드가 포함 된 유체 범위의 너비가 백분율 (또는 847.23px와 같은 너비) 인 경우에만 문제가 발생합니다. 부트 스트랩 열 (span9)이 유동적 일 필요가 있기 때문에 문제를 해결할 수 없습니다.

나는 또한 내가 (부모에 Math.floor() (fluid span9) 폭을 비 비율 폭을 지정하는 다른 사업부 내부에 있지만 효과를 내 그리드를 포장했습니다.

Answer 1

나는 당신의 바이올린을 시도하고 내가 얻을 해달라고 왜 같은 그 행동하는 그.

한번에 제거하여 #grid에서 margin: 0px auto; 나는 왼쪽 상단에 다시 요소를 드래그 할 수.

이

#grid { 
    //margin: 0px auto; //remove this 
    position: relative; 
    background: #ffcc00; 
}