0

absolute-positioneddivの下にあるこのdivがありfixedます。次に、 を含むフォームを挿入しようとしましたが<input>、何も入力できません。

#navbar {
    width: 100%;
    padding: 30px;
    position: fixed;
    background-color: #0066CC;
    box-shadow:  0px 10px 40px 3px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:  0px 10px 40px 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow:  0px 10px 40px 3px rgba(0, 0, 0, 0.5);
}

#main_index {
    left: 8%;
    right: 8%;
    width: 85%;
    top: 300px;
    z-index: -1;
    min-height: 100px;
    position: absolute;
    border: 1px solid #CCCCCC;
    background-color: #FFFFFF;
}

<div id="navbar"><center><b>NAVBAR</b></center></div>

<div id="main_index">
    <div id="index_login">
        <form action="login" method="post">
            <input type="text" required="required" name="username">
            <br />
            <input type="password" required="required" name="password">
        </form>
    </div>
</div>
4

3 に答える 3

1

私はあなたが試してみるべきだと思います：

#navbar {
width: 100%;
padding: 30px;
position: fixed;
z-index: 2;<----------------------bigger than #main_index
background-color: #0066CC;
box-shadow:  0px 10px 40px 3px rgba(0, 0, 0, 0.5);
-moz-box-shadow:  0px 10px 40px 3px rgba(0, 0, 0, 0.5);
-webkit-box-shadow:  0px 10px 40px 3px rgba(0, 0, 0, 0.5);
}

#main_index {
left: 8%;
right: 8%;
width: 85%;
top: 300px;
z-index: 1;<--------------------- positive
min-height: 100px;
position: absolute;
border: 1px solid #CCCCCC;
background-color: #FFFFFF;
}
于 2012-12-16T18:16:16.847 に答える
1

あなたの問題の少なくとも一部は、中央のタグが減価償却されていることだと思います. 属性「align:center;」を持つスタイル シートを使用します。それをDIVに適用します。

于 2012-12-16T18:02:25.783 に答える
0

html の残りの部分がどのように見えるかはよくわかりませんが、 div#navbarがオーバーフローしていないことは確かですか。#main_indexテスト目的で追加してみてください。

height:100px;
overflow:hidden;

あなたの#navbarCSSスタイルで何が起こるか見てください。

于 2012-12-16T18:08:09.537 に答える