jQuery UI选项卡按heightStyle获取错误的高度："；内容“；如果桌子在里面

我最近开始使用jQueryUI选项卡，我想在选项卡中放置一个表。选项卡应该尽可能小，因此我希望它的高度与内部表格的高度相关，因此我使用heightStyle:“内容”

问题是，当我激活选项卡时，它会向下滑动，就像它的高度设置正确一样，但当向下滑动的效果完成时，选项卡的高度设置为1px。 下面你可以看到我正在使用的代码

HTML代码：

<div id="tab_layer" class="tab_layer_l">
    <ul>
        <li><a href="#content_tab_layer">tab1</a></li>
    </ul>
    <div id="content_tab_layer" class="ui-widget">
        <table border=1 cellspacing=0 cellpadding=5 align=left>
            <tr>
                <td width=50%>...</td>
                <td width=50%>...</td>
            </tr>
            <tr>
                <td width=29%><input type="text" value="" /></td>
                <td width=29%><input type="text" value="" /></td>
            </tr>
            <tr>
                <td width=29%><input type="text" value="" /></td>
                <td width=29%><input type="text" value="" /></td>
            </tr>
            <tr>
                <td width=29%><input type="text" value="" /></td>
                <td width=29%><input type="text" value="" /></td>
            </tr>
        </table>
    </div>

---

如果有人能帮助我，我会非常高兴。我在互联网上搜索了很多，但似乎没有其他人有这个问题：（

由于某种原因，我没有得到幻灯片效果，但我注意到不适合表格。一旦我删除了表格对齐属性，布局就正确显示

---

我希望它能有所帮助。

感谢您的帮助，当删除align属性或将其设置为“居中”时，它可以完美地工作！！

$('#tab_layer').tabs({
    active: false,
    collapsible: true,
    event: "mousedown touchstart",
    heightStyle: "content",
    hide: {effect: "slideUp", duration: 500},
    show: {effect: "slideDown", duration: 500},
});