2012-06-27 1 views
0

많은 양의 데이터를 수용하기 위해 jQuery UI 아코디언을 여기에 추가했습니다 : http://www.letmagichappen.com/web_resources. 아코디언은 잘 작동하지만 내용 영역의 크기가 내용보다 훨씬 큽니다. html로 꽤 정직jQuery UI 컨텐츠 영역이 지금까지 페이지 아래로 확장되는 이유는 무엇입니까?

.web_resources .ui-accordion { width: 100%; } 
.web_resources .ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; } 
.web_resources .ui-accordion .ui-accordion-li-fix { display: inline; } 
.web_resources .ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; } 
.web_resources .ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; } 
.web_resources .ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; } 
.web_resources .ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } 
.web_resources .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; } 
.web_resources .ui-accordion .ui-accordion-content-active { display: block; } 

:

<script type="text/javascript"> 
$(function(){ 
    $(".web_resources").accordion({ header: "h4" }); 
}); 
</script> 

내가 어떤 통찰력을 부탁드립니다 : 여기에

<h4>Chapter 1</h4> 
<div> 
<p><a href="http://www.ajronline.org/content/153/1/87.full.pdf">Rotator Cuff Tears: Prospective Comparison of MR Imaging with Arthrography, Sonography, and Surgery</a></p> 
<p><a href="http://www.nejm.org/doi/pdf/10.1056/NEJM199407143310201">Magnetic Resonance Imaging of the Lumbar Spine in People without Back Pain</a></p> 
<p><a href="http://www.ajronline.org/content/147/2/293.full.pdf+html">1.5 Tesla Surface Coil MRI of the Knee</a></p> 
<p><a href="http://www.yogaresearchsociety.com/">Yoga Research Society</a></p> 
<p><a href="http://www.rsna.org/">Radiological Society of North America</a></p> 
<p><a href="http://www.apple.com">Sample 1</a></p> 
</div> 

는 아코디언 코드입니다

은 내가 CSS를 검토 컨텐트 영역이 너무 커 보이고 어떻게 제어 할 수 있는지에 대해 설명합니다.

감사합니다.

답변

0

이것은 내가 생각했던 것보다 훨씬 간단했습니다. 기본적으로 Accordion은 가장 큰 div에 대한 자동 높이입니다.

autoHeight를 : 변경하려면 그로 설정해야합니다 거짓