对话框中的选项卡会导致对话框's高度:自动不工作

Tabs inside of a Dialog causes the Dialog's height:auto to not work

本文关键字：对话框 高度 工作 选项      更新时间：2023-09-26

已解决：请参阅下面的注释。

我在对话框中创建了一个选项卡，但对话框的高度与选项卡的高度不一致

在这种特殊情况下，选项卡中有一个表单。如果用户提交了表单，并且存在错误，则选项卡的高度将增加以显示错误。但是，父对话框的高度不会自动调整大小以匹配内部选项卡的高度。

|-tab1-|-tab2-|------|
|                    |
|-(end of dialog)----| (text stops here)
 |                  |
 |                  |
 |                  |
 |-(end of tab)-----| (not visible)

我该怎么解决这个问题？

问题是以下默认的jQuery UI CSS:

.ui-tabs .ui-tabs-panel { 
    display: block;
    border-width: 0; 
    padding: 1em 1.4em;
    background: none;
}

收到了一行额外的CSS，使选项卡中的内容无法自动调整大小：

.ui-tabs .ui-tabs-panel { 
    display: block;
    border-width: 0; 
    padding: 1em 1.4em;
    background: none;
    position: absolute; //This line was causing the problem
}
相关文章：