Angularjs 角度UIGrid列标题标签、排序优先级和菜单重叠

我注意到，如果标题中没有足够的空间，则列标题中的项目开始重叠。如果列太窄，标签将被截断（例如，“性别”变为“性别…”）。理想情况下，排序图标应位于标签旁边，列菜单应向右浮动。或者排序图标和列菜单图标都应该向右浮动

以下是预览：

我尝试更新标题容器，使它们一个接一个地流动，但没有成功

.ui-grid-header-cell-label {
    display: inline-block;
    width: auto;
    float: left;
}

.ui-grid-column-menu-button {
    display: inline-block;
    float: right;
    ...
}

有没有办法使图标不会重叠？理想情况下，列宽不应小于截断的文本+分拣机的宽度+列菜单的宽度，并且每个元素应彼此相邻：

[标签/\=]

我用CSS做了很多尝试，但都没能成功

谢谢