div 높이 부트 스트랩을 기준으로 패널의 높이를 자동으로 조정합니다.

Question

프런트 엔드 개발에 초보자입니다. 우리는 한 페이지 앱을 제작 중이며 두 개의 패널이 있습니다.

상단의 패널에는 검색을위한 입력 텍스트가 들어 있으며 입력 텍스트 아래에는 페이지 매김이있는 ag-grid가 있습니다.

사용자가 그리드 열의 셀 값 중 일부를 클릭하면 격자 아래 및 패널 내에서 설명 텍스트가있는 div가 나타납니다. 이제이 텍스트 길이는 2 줄에서 20 줄까지 다양합니다. 내가 달성하고 싶은 것은 자동으로 패널 높이를 조정하여 텍스트가 더 작을 때 빈 공간이없는 ag-agrid와 div를 모두 포함하고 텍스트가 더 크면 패널에서 div의 텍스트가 넘치지 않아 모든 것이 올바르게 작동합니다. resolutions.I는 패널 bootstrop CSS의 클래스를 사용하고 - panel..appreciate에 대한 패널 차있는 통찰력 ..

<div class="container-fluid"> 
    <div class="panel panel-primary" style="height:auto"> 
     <div class= "panel-heading"> {{panelTitle}} </div> 
      <div class="panel body"> 

       <ag-grid-angular class="ag-blue" [gridoptions]="gridOptions" rowModelType="pagination" style="min-height:70%"></ag-grid-angular> 

        <div class="alert"> {{description}} 
        </div> 
      </div> 
    </div> 
</div> 

Answer 1

U 패널의 높이를 설정하는 CSS를 사용하여 자동으로

.panel_name{ 
    height:auto; 
}