0

我有一个边框很厚的 div,我希望在边框的右上角有关闭按钮,而不是 div。我遇到的问题是,无论我放什么 z-index,边框总是在我的关闭按钮 div 的顶部。我尝试将边框设置在 div 的内部,但同样的问题一直在发生。有什么建议么?

谢谢!

.aboutcontainer{
    position: relative;
    width: 55%;
    height: 70%;
    margin: auto;
    margin-top: 6%;
    background: white;
    z-index: 3;
    border: 20px solid black;
    padding-left: 15px;
    padding-right: 15px;
    overflow: auto;

    box-shadow: inset 0px 5px 2px black, 0px 5px 5px #333333;
    -moz-box-shadow: inset 0px 5px 2px black, 0px 5px 5px #333333;
    -khtml-box-shadow: inset 0px 5px 2px black, 0px 5px 5px #333333;
    -webkit-box-shadow: inset 0px 5px 2px black, 0px 5px 5px #333333;
}

.closeBtn {
    position: absolute;
    top: -10px;
    right: -10px;
    border: solid 1px red;
    z-index: 4;
    cursor: pointer;
}
4

3 回答 3

0

从 .aboutcontainer 中删除边框。将它放在另一个div中,并为该父容器提供一些填充和背景颜色,以创建边框效果。将您的.aboutcontainer.closeBtn放在该 div 中,现在您可以自由地将关闭按钮放置在您想要的任何位置,同时保持 .aboutContainer 的溢出属性不变。

于 2012-11-07T08:50:04.880 回答
0

在这里删除overflow:auto甚至z-index是没有必要的。给width内部heightdiv 以查看效果。

演示

于 2012-11-07T05:52:56.123 回答
0

您的overflow: auto;标签隐藏了 main 之外的所有内容div,包括边界顶部的内容。删除它,按钮将显示。

于 2012-11-07T05:09:04.813 回答