对齐问题-z-index问题
是的，我有一个标题和一个小 div .sideShadow，我需要 .shideShadow div 位于 #sideTopHeader div 后面，现在它位于其顶部，您可以在此处（右侧）看到它
我现在使用的CSS
#sideTopHeader {
background: #333333;
z-index: 1;
position: relative;
height: 50px;
margin: 0 -30px 0 0;
-webkit-border-radius: 7px 7px 0 7px;
-khtml-border-radius: 7px 7px 0 7px;
-moz-border-radius: 7px 7px 0 7px;
border-radius: 7px 7px 0 7px;
}
.sideShadow {
border-color: transparent transparent transparent #1f1f1f;
border-width: 15px;
border-style: solid;
height: 0;
width: 0;
position: absolute;
top: 35px;
left: 395px;
z-index: 0;
}
Right, I have a header and a small div .sideShadow, I need .shideShadow div to be behind a #sideTopHeader div, right now it is on the top of it, you can see it here (to your right)
CSS I use now
#sideTopHeader {
background: #333333;
z-index: 1;
position: relative;
height: 50px;
margin: 0 -30px 0 0;
-webkit-border-radius: 7px 7px 0 7px;
-khtml-border-radius: 7px 7px 0 7px;
-moz-border-radius: 7px 7px 0 7px;
border-radius: 7px 7px 0 7px;
}
.sideShadow {
border-color: transparent transparent transparent #1f1f1f;
border-width: 15px;
border-style: solid;
height: 0;
width: 0;
position: absolute;
top: 35px;
left: 395px;
z-index: 0;
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
@llya；将您的
.slidershowdiv 放在您的#sideTopHeaderdiv 之外，而不是像这样的HTML:
&相对于其父级的
相对位置。也许这对你有用@llya; put your
.slidershowdiv outside of yours#sideTopHeaderdiv instead of inside like thisHTML:
&
position relativeto it's parent . May be that's work for you不更改标记：不要在
#sideTopHeader上使用z-index（顺便说一句：为什么这是一个 ID？侧边栏中真的只有一个元素吗？）并将.sideShadow的z-index设置为-1。但我真的建议，你最好清理你的标记。您实际上并不需要三个嵌套的 DIV 来设置单个内容元素的样式。例如，您可以使用伪元素来实现 CSS 效果，例如
#sideTopHeader:after，而不是使用嵌套的div.sideShadow。Without changing the markup: don't use a
z-indexon#sideTopHeader(BTW: why is this an ID? Is there really only one element inside the sidebar?) and set thez-indexto-1for.sideShadow.But I really suggest, you'd better clean up your markup. You don't really need three nested DIV's for styling a single content-element. For example instead of having a nested
div.sideShadow, you may use a pseduo-element for CSS-effects, like#sideTopHeader:after.