根据div高度自举调整面板的高度

Question

我是前端开发的新手.. 我们正在构建一个单页应用程序，我们有两个面板。

顶部的面板包含用于搜索的输入文本，输入文本下方是带分页的ag-grid。

当用户单击网格列中的某些单元格值时，网格下方和面板内会显示带有说明文字的div。 现在这个文本长度可以从2行到20行不等。我想要实现的是自动调整面板高度以覆盖ag-agrid和div，当文本较小时没有任何空白空间，并且当文本较大时，div中的文本不会溢出面板，这应该可以正常工作我正在使用bootstrop css类作为面板 - 面板主要用于面板..了解任何见解..

  <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

你可以使用css自动设置面板的高度

.panel_name{
   height:auto;
}