Jquery 溢出-x和溢出-y在chrome中无法正常工作

我用下面的css代码制作了一个常用的表格来隐藏单元格中的额外文本

.table td{
   display: table-cell;
   white-space: nowrap;
   text-overflow: ellipsis;
   max-width: 250px;
   width: inherit;
   overflow-y: hidden;
   overflow-x: visible;
}

Html代码

<table class="table table-striped table-bordered table-hover">
                                    <thead>
                                        <tr>
                                            <th> # </th>
                                            <th>Name</th>
                                            <th class="hidden-xs">Code</th>
                                            <th>Category</th>
                                            <th class="hidden-xs">Location</th>
                                            <th>More</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr role="row" class="odd">
                                            <td>21</td>
                                            <td class="sorting_1">XXXXXXXX</td>
                                            <td>00000000</td>
                                            <td>xxxxxxxxxx</td>
                                            <td>No: xx/x</td>
                                            <td>
                                                <div align="center">
                                                    <div class="btn-group">
                                                        <a class="btn btn-xs btn-blue dropdown-toggle btn-sm" data-toggle="dropdown" href="#">
                                                            <i class="fa fa-cog"></i> 
                                                            <span class="caret"></span>
                                                        </a>
                                                        <ul role="menu" class="dropdown-menu pull-right">
                                                            <li role="presentation">
                                                                <a role="menuitem" tabindex="-1" href="../asset/edit?id=57">
                                                                    <i class="fa fa-edit"></i> Edit
                                                                </a>
                                                            </li>
                                                            <li role="presentation">
                                                                <a data-toggle="modal" role="menuitem" tabindex="-1" href="#model57">
                                                                    <i class="fa fa-times"></i> Remove
                                                                </a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>

# 
名称
代码
类别
位置
更多
21
XXXXXXXX
00000000
XXXXXXXXX
编号：xx/x

每个表格的单元格中都有一个按钮，单击按钮时会显示一个下拉列表，如下图所示。

对于上面的代码，下拉菜单在firefox中正常工作，但在chrome中，它隐藏了下拉菜单，如下所示。

我需要为每个表中的工作制作一个通用的css代码。如何在chrome中解决此问题

这里是小提琴的例子。使用firefox和chrome进行检查

---

如果要尝试使用菜单为

块设置
z-index
，该怎么办

UPD:我可以看到问题不在于TD，而在于
ul.下拉菜单。向右拉

UPD2:

.table td ul.dropdown-menu.pull-right{
  display:block; 

}

UPD3:
将此样式用于表格的最后一列

table tr td:last-child {
   text-overflow: initial;
   overflow-y: visible;
   overflow-x: visible;
}

请试试这个


$（“.btn group”）.parent（）.parent（“td”）.addClass（“drp_菜单”）
。表td{
显示：表格单元格；
空白：nowrap；
文本溢出：省略号；
最大宽度：250px；
宽度：继承；
溢出y：隐藏；
溢出x：可见；
}
td.drp_菜单{
溢出：可见；
}

# 
名称
代码
类别
位置
更多
21
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
00000000
XXXXXXXXX
编号：xx/x






请提供您要检查的代码。删除溢出-y:hidden@ankitapatel您需要哪种代码？Html代码？@Udara yes Html code..table td:last child{overflow-y:auto；}那么我认为您还必须给出Html代码示例。请您将代码笔链接与您的答案共享。它将帮助其他人well@Udara完成。我加了，谢谢。我将检查您正在使用的代码
overflow-y:visible；溢出x：可见用于
表td
。它将禁用我在其他单元格中隐藏额外文本这仅适用于此表。但是我需要做一个公共表css代码。因为有时按钮不在最后一列中，所以可以使用hasChild方法，如表trtd:hasChild（