不能在ASP.NET中的另一个前面设置div

Question

我正在创建一个简单的登录系统，但看起来div们互相交互。 Div2在Div1前面：

红色div后面有一些标签和其他文本按钮。

我的ASP.NET代码：

<div id ="LoginPannel"> /* <-- this is div 1*/
    <asp:Button ID="Button1" runat="server" Text="Login" OnClick="Button1_Click1" />
    <asp:Label ID="Label1" runat="server" Text="Username" Font-Bold="True" ></asp:Label>
    <asp:Label ID="Label2" runat="server" Text="Password" Font-Bold="True"></asp:Label>
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
    <asp:Label ID="Label3" runat="server" Text="Login"></asp:Label>
    <asp:Button ID="Button3" runat="server" Text="Having Problems?" OnClick="Button3_Click" />


</div>

<div id="topForm"> /* <-- this is div 2 */


</div>

2个div后面的代码就是这个。

CSS代码：

#LoginPannel{
   border-style: none;
   background-color:   #263540;
   position:absolute; 
   top: 42%;
   left:25%;
   width:268px;
   height: 115px;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
    border-radius: 10px;
}

#topForm {
    position: absolute;
    top: 0%;
    left:0;
    z-index:0;
    width: 500px;
    height:500px;
    background-color: red;
}

Answer 1

显然，您在“登录”面板中缺少<target>。

＆＃13;

＆＃13;

z-index: 1;

＆＃13;

#LoginPannel {
  border-style: none;
  background-color: #263540;
  position: absolute;
  z-index: 1;
  top: 42%;
  left: 25%;
  width: 268px;
  height: 115px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
#topForm {
  position: absolute;
  top: 0%;
  left: 0;
  width: 500px;
  height: 500px;
  background-color: red;
}

＆＃13;

＆＃13;

＆＃13;

Answer 2

您可以尝试将登录面板放在顶部窗体div中，使其保留在其中并位于其顶部。

<div id="topform">

    <div id="LoginPanel"> ... </div>

</div>