Css DIV/SPAN标记在最后一个网格上未显示完整

在Angular8上使用剑道网格。我有代码在另一个DIV上悬停时显示一个DIV。它的模板会在网格上的每一行上重复。它在除最后一行外的所有行上都能正常工作并显示，最后一行中DIV的大部分隐藏在网格中

试图更改样式的显示和位置参数。尝试了所有组合中的大部分

代码

显示为子菜单的DIV的样式

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 50px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 3px 3px;
    z-index: 1;
    cursor: pointer;
    border-style: solid;
    border-color: lightblue;

---

这将是伟大的，如果你能创建一个stackblitz，所以我们可以发挥一些安全原因，stackblitz不会打开在我的工作。对不起，可以打开其他选项吗？jsfiddle、codepen、jsbin、plunker、codesandboxI通过修改子菜单的大小并移动顶部以与行对齐来解决问题。现在它实际上与字段右侧的行对齐。抱歉，此处阻止了代码发布工具。谢谢你的回复。

.dropdown {
    position: relative;
    display: contents;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 50px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 3px 3px;
    z-index: 1;
    cursor: pointer;
    border-style: solid;
    border-color: lightblue;