时间戳

首页 > 解决方案 > 如何根据其中最大选项卡的最大涨幅为所有选项卡提供页面高度

javascript - 如何根据其中最大选项卡的最大涨幅为所有选项卡提供页面高度

问题描述

如何根据其中最大选项卡的最大涨幅为所有选项卡提供页面高度

例子

<div id="" class="tab-pane fade  in active">
    <ul class="autoValidate nav nav-tabs nav-justified nav-thirdlevel hidden-xs">
        <li class="active"><a data-toggle="tab" href="#tab1">tab1</a></li>
        <li><a data-toggle="tab" href="#tab2">tab2</a></li>
        <li><a data-toggle="tab" href="#tab3">tab3</a></li>
    </ul>
    <div class="panel-group visible-xs" id="undefined-accordion"></div>
    <div class="tab-content tab-contentlevel hidden-xs stander-Page-Height">
        <div id="tab1" class="tab-pane fade active in"> // for example this tab height is 400px
            // something....
        </div>
        <div id="tab2" class="tab-pane fade"> // for example this tab height is 600px
            // something....
        </div>
        <div id="tab3" class="tab-pane fade"> // for example this tab height is 500px
            // something....
        </div>
    </div>
</div>

例如，我如何使用（css || js || jquery）将页面中的每个选项卡的高度设为 600px

非常感谢你

标签： javascriptjquerycss

解决方案

.tab-content { 
    display:flex; 
    flex-direction: row;
    align-items: strech
    // other css rules
}

将 align-items 设置为strech所有子项将强制填充其父项的高度。

推荐阅读