2013-01-09 3 views
2

아래쪽 창의 크기를 조정하면보기가 축소되어 원래 크기로 돌아올 수 없습니다. 또한 크기를 100 %로 설정하더라도보기가 전체 화면을 차지하지 않습니다.jQuerySplitter 컨트롤/kendepplitter가 크기 조정되지 않음

$("#vertical").kendoSplitter({ 
    orientation: "vertical", 
    panes  : [ 
     { 
      collapsible: false,//toolbar should be a set height and unable to be collapsed 
      resizable : false, 
      size  : "50px" 
     }, 
     { 
      collapsible: false //main section, not collapsible, but resizable 
     }, 
     { 
      collapsible: true, size: "200px" 
     } 
    ] 
}); 

을하지만이 완료 될 때마다, 스크롤 나머지는 공백 아래에 숨겨져되면서, 창에 나타납니다 : 나는 수직 단면이 같은 중간과 하단 창에 고정 크기를 설정하려고했습니다.

jsFiddle : jQuery를 분배기/kendoSplitter의 here

예 : here

답변

3

mainView에 대해 다음 CSS 정의를 사용해보십시오 :

#mainView { 
    position: absolute; 
    top: 0; 
    bottom: 0; 
    left: 0; 
    right: 0; 
} 

이 메인 컨테이너가 화면의 100 %를 차지한다 창 크기가 조정될 때 크기 조정.

this 수정 된 JSFiddle에서 확인하십시오.

+0

왜 그게 효과가 있었는지 물어 보면 고마워요. 위치 이후에 필드가 가장자리에 패딩이 없도록 강요합니까? – CBredlow

+0

물론 저는 신경 쓰지 않습니다 ... 사실 내 브라우저 (Chrome)에서는 중앙 영역 ('main_pane')이 0px로 렌더링되었고 스타일 중 일부가 시작되었습니다. 그런 다음 페이지를 사용하여 영역을 확대하고 축소하는 데 사용하는 것을 사용하지 않는다는 사실을 깨달았습니다 ('mainView'에서 정의한 스타일). 이것을 해결하고,'main_pane'을 풀었고 나는 다른 스타일을 이전 상태로 되돌려 놓았습니다. 결론 :'position : absolute'를 정의하고'div'를 컨테이너 크기에 맞추기 위해'top','bottom','left' 및'right'을 0으로 설정하는 것이 좋습니다. – OnaBai

관련 문제