jquery隐藏然后显示后，width:auto元素的宽度比正常小

Question

我正在尝试显示信息列表，并且它可以正常工作，但是当我隐藏包含该列表的 div 然后再次显示它时，具有“width: auto”样式的元素的宽度将被重新调整大小，并且新尺寸太小：

隐藏前：

隐藏后：

我的 php 生成元素如下所示：

<div displayitem='true'>
    <table>
        <?php
            foreach($aExistingChangeDetailsData['customers'] as $aCustomer){
                ?><tr><td><li style='width:auto;'><?php echo $aCustomer['sCustomerName']; ?></li></td></tr><?php
            }
        ?>
    </table>
</div>

我的 jquery 很简单：

function expandSection() {
    $("div.cd-content").show("slow");
}

function collapseSection() {
    $("div.cd-content").hide("slow");
}

我猜测问题是由于幻灯片动画的调整大小性质造成的，是否有任何简单的方法可以在隐藏后保持 width:auto 元素的宽度，以便将它们恢复到正确的大小？

编辑：似乎每个元素的宽度都减少了 5。

Answer 1

尝试分别使用fadeIn和fadeOut代替show和hide，导致hide()将元素的宽度更改为零，但fadeOut()更改属性opacity并且不更改width