如果父级溢出，如何使子元素（下拉）可见：auto？

Question

我有一个子元素，它在点击它时作为下拉，而父元素有溢出：auto;（我需要一个垂直滚动条，它有一个固定的高度）。

如果将属性溢出设置为auto to parent？

，为什么隐藏子元素？

HTML：

<div class="dataTables_scrollBody">
    <table class="dataTable">
            <tr class="ListRow">
                <td class=" column-2 sorting_1">
                    <ul class="ui-corner-all">
                    <li class="cv-shortcut-link">test link 1</li>
                    <li class="cv-shortcut-link">test link 2</li>
                    <li class="cv-shortcut-link">test link 3</li>
                    <li class="cv-shortcut-link">test link 4</li>
                    </ul>
                </td>
            </tr>
            <tr class="ListRow">
                <td class=" column-2 sorting_1">
                    parent list
                </td>
            </tr>
            <tr class="ListRow">
                <td class=" column-2 sorting_1">
                    parent list
                </td>
            </tr>
    </table>
</div>

CSS：

.dataTables_scrollBody{height: auto;
    max-height: 80px;
    overflow: auto;
    width: 100px;}
    .ListRow {
    background-color: #EDF0F2;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 8pt;
    padding: 3px;
    text-align: left;
}
.ListRow td {
    padding: 2px 3px;
}
.ui-corner-all{ border:green solid 1px;}
.ui-corner-all li{ list-style:none;}

小提琴：http://jsfiddle.net/DHW9x/