0

我有这个 Default.aspx 设计

<head runat="server">
    <title></title>
    <style type="text/css">
        .heading
        {
            text-align: center;
            border-style: double;
            background-color:#F2A988;
            font-family:Sans-Serif;
            font-weight:bold;

        }
        #wrapper {
            margin: 0 auto;
            width: 400px; 
            text-align:left;
        }
        .style1
        {
            text-align: center;
            font-family:Sans-Serif;
        }
        .style2
        {
            font-family: Arial, Helvetica, sans-serif;
        }
    </style>
</head>
<body style="height: 642px; width: 911px; " id="wrapper">
    <form id="form1" runat="server">

    <div class="heading">
        Sheridan Computer Club - Inquiry Form</div>
        <br />

    <asp:Calendar ID="Calendar1" runat="server" Font-Names="Arial"></asp:Calendar>



        <br />

    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <asp:Button ID="btnInfo" runat="server" Font-Names="Arial" 
        onclick="btnInfo_Click" style="font-weight: 700" 
        Text="I'd like to receive more information!" Width="261px" />
    <asp:Panel ID="form" runat="server" Height="259px" Width="392px" 
        Visible="False">
        <span class="style2">If you would like to join the club or receive more 
        information about the club fill in the form below &amp; click submit button.<br />
        <br />
        </span><b>
        <asp:Label ID="Label1" runat="server" Font-Names="Arial" Text="First Name:"></asp:Label>
        &nbsp; </b>
        <asp:TextBox ID="TextBox1" runat="server" Width="184px"></asp:TextBox>
    </asp:Panel>

    <div id="meeting" 


        style="position:relative; top: -359px; left: 339px; width: 232px; height: 64px; text-align: center; margin-top: 0px; font-family: Arial; font-weight:bold;">
        <br />
&nbsp;&nbsp;&nbsp;&nbsp;
        <asp:Label ID="lblDate" runat="server"></asp:Label>
        <br />
        </div>



    <div style="width: 308px; position:relative; top: -552px; left: 307px; margin-top: 0px;" 
        class="style1">
        Click Below to find out when
        <br />
        the club meets next</div>

    <div style="position:relative; top: -591px; left: 646px; width: 274px; height: 289px; font-family:Sans-Serif;">
        <b>View Members by Program:<br />
        <asp:ListBox ID="ListBox1" runat="server" Height="175px" Width="263px">
        </asp:ListBox>
        </b></div>

    <div style="position:relative; top: -797px; left: 351px; width: 192px; height: 32px; text-align: center; margin-top: 0px;">
        <asp:Button ID="Button1" runat="server" Text="Next Meeting" 
            onclick="Button1_Click" />
    </div>

    </form>
</body>
</html>

问题是，面板干扰了我放置的 div，只有在我单击我不想要的按钮后才会加载 Div。我正在做的是单击隐藏按钮本身并显示包含提交表单的面板的按钮。

这是我正在使用的 button_click 的代码，

protected void btnInfo_Click(object sender, EventArgs e)
    {
        btnInfo.Visible = false;
        form.Visible = true;
    }

我无法弄清楚出了什么问题？

4

1 回答 1

0

我认为这与你的position:relative风格元素有关。

看看创建 css 列并将列表框浮动到日历的右侧。

创建两列布局指南

于 2012-06-17T07:40:39.110 回答