协助z索引导致各种错误 [英] Assistance with z index causing various errors

问题描述

请看一下这个网页 - http://dev.topyaps.com/how-awesome-are-you



这篇文章是由一个建立的我开发的wordpress插件。由于元素的z索引属性，我面临各种问题。问题是 -



1）滚动菜单会合并页面上的浮动栏。菜单的CSS -

Please have a look at this webpage - http://dev.topyaps.com/how-awesome-are-you

This post is built by a wordpress plugin that I developed. I am facing various issues because of the z index property of elements. The issues are -

1) On scroll the menu merges with the floating bar on the page. CSS of menu -

kodda_container {
    z-index: 999 !important;
    width: 1220px;
    height: 40px !important;
    background-color: ;
    border-top: solid transparent;
    border-right: solid transparent;
    border-bottom: solid transparent;
    border-left: solid transparent;
    background-image: -webkit-linear-gradient(top, transparent, transparent);
}

浮动条的Css -

Css of floating bar -

.scoreBox {
    background: #fafafa;
    border: 1px solid #d1d1d1;
    width: 100%;
    z-index: 997;
}

2）点击提交按钮后会出现一个中心框。中心盒在隐藏时必须位于顶部。



中心盒的Css -

2) On clicking the submit button a center box appears. The center box has to be on the top while it hides.

Css of center box -

element.style {
    padding: 6px;
    word-wrap: break-word;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -18px;
    margin-left: -206px;
    z-index: 999;
    display: block;
}

3）尝试点击主页上的登录和注册按钮 - http://dev.topyaps.com/。

这是登录/注册弹出窗口的实际样式。但在帖子你有多棒？ ，当我们点击登录/注册时，样式会更改为中心框的样式（单击提交按钮时出现的样式）。



登录框的Css -

3) Try clicking on login and register button on the homepage - http://dev.topyaps.com/.
This is the actual styling of the login/register popup. But in the post "How awesome are you?" , when we click on login/register the styling changes to the styling of the center box (the one that appears on clicking the Submit button).

Css of login box -

element.style {
    display: block;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -163.5px;
    margin-left: -230px;
    z-index: 10001;
}

请试着告诉我解决这些问题的方法。







已添加 pre 标签。

[/编辑]

推荐答案

这篇关于协助z索引导致各种错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！