Html z索引和溢出未使div正确显示

我正在进行一个项目，当用户将鼠标悬停在一个框上时，我会显示消息。我创建了一个场景来模拟我遇到的问题

蓝色框应该按照定义显示为完整的250px，而不是剪切到包含div设置为的200px。无论如何，为了解决这个问题，我可以将蓝色框放在包含div之外，作为需要自包含的UserControl的所有部分

#首先{
宽度：200px；
高度：200px；
背景颜色：绿色；
溢出：隐藏；
}
#第二{
宽度：50px；
高度：50px；
背景色：红色；
位置：相对位置；
}
#第四
{
宽度：250px；
高度：50px；
背景颜色：蓝色；
位置：绝对位置；
z指数：100；
}

测试

更改：

#first {
    width: 200px;
    height: 200px;
    background-color: green;
    overflow: hidden;

}

到

}

换句话说，删除overflow:hidden，蓝色div将按您的意愿显示。

更改：

#first {
    width: 200px;
    height: 200px;
    background-color: green;
    overflow: hidden;

}

到

}

---

换言之，删除溢出：隐藏，蓝色div将按照您的意愿显示。

不完全确定这是您想要的，但您需要做的只是在

第一个
div上将溢出从隐藏更改为可见：


#首先{
宽度：200px；
高度：200px；
背景颜色：绿色；
溢出：可见；/*更改此项*/
}
#第二{
宽度：50px；
高度：50px；
背景色：红色；
位置：相对位置；
}
#第四
{
宽度：250px；
高度：50px；
背景颜色：蓝色；
位置：绝对位置；
z指数：100；
}

测试
不完全确定这是您想要的，但您需要做的只是在
第一个
div中将溢出从隐藏更改为可见：


#首先{
宽度：200px；
高度：200px；
背景颜色：绿色；
溢出：可见；/*更改此项*/
}
#第二{
宽度：50px；
高度：50px；
背景色：红色；
位置：相对位置；
}
#第四
{
宽度：250px；
高度：50px；
背景颜色：蓝色；
位置：绝对位置；
z指数：100；
}

测试
正如Wired所说，您必须删除
溢出：隐藏来自#第一个元素。否则，内部的所有元素都将被切断，如果它们应该到达外部的边界


#首先{
宽度：200px；
高度：200px；
背景颜色：绿色；
}
#第二{
宽度：50px；
高度：50px；
背景色：红色；
位置：相对位置；
}
#第四
{
宽度：250px；
高度：50px；
背景颜色：蓝色；
位置：相对位置；
排名：0；
左：0；
z指数：100；
}

测试
正如Wired所说，您必须删除
溢出：隐藏来自#第一个元素。否则，内部的所有元素都将被切断，如果它们应该到达外部的边界


#首先{
宽度：200px；
高度：200px；
背景颜色：绿色；
}
#第二{
宽度：50px；
高度：50px；
背景色：红色；
位置：相对位置；
}
#第四
{
宽度：250px；
高度：50px；
背景颜色：蓝色；
位置：相对位置；
排名：0；
左：0；
z指数：100；
}

测试
Remove
#first{overflow:hidden}
因为这是预期的行为，除了更改CSS/HTML结构之外没有其他解决方法Remove
#first{overflow:hidden}
因为这是预期的行为，除了更改CSS/HTML结构之外没有其他解决方法。这应该是一个注释，不是答案。这应该是一个评论，而不是答案。这不是我完全想要的，因为我希望仍然包括滚动条，但除了将第四个div移到第一个div之外，似乎没有其他解决方法。因此，我要看看是否可以尝试定位元素，以便确定包含div的边在何处，并在包含div内显示。这不是我的全部意图，因为我希望仍然包括滚动条，但除了将第四个div移到第一个div外，似乎没有其他解决方法。因此，我要看看是否可以尝试定位元素，使其确定边在包含div中的位置，并显示在包含div中