Question

所以，我有一个非常简单的ASP.Net页面。它看起来像这样：

<head runat="server">
<style>
   *{ padding:0; margin:0; }
   table{ height:100%; width:100%; }
   input { background-color:black; width:100%; height:100%; }
</style>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
    <table>
        <tr>
            <td><asp:Button ID="Button00" runat="server"  OnClick="Button_Click" /></td>
            <td><asp:Button ID="Button10" runat="server"  OnClick="Button_Click" /></td>
            <td><asp:Button ID="Button20" runat="server"  OnClick="Button_Click" /></td>
            <td><asp:Button ID="Button30" runat="server"  OnClick="Button_Click" /></td>
            <td><asp:Button ID="Button40" runat="server"  OnClick="Button_Click" /></td>
            <td><asp:Button ID="Button50" runat="server"  OnClick="Button_Click" /></td>
            <td><asp:Button ID="Button60" runat="server"  OnClick="Button_Click" /></td>
            <td><asp:Button ID="Button70" runat="server"  OnClick="Button_Click" /></td>
            <td><asp:Button ID="Button80" runat="server"  OnClick="Button_Click" /></td>
        </tr>
        <tr>
            <td><asp:Button ID="Button01" runat="server"  OnClick="Button_Click" /></td>
            <td><asp:Button ID="Button11" runat="server"  OnClick="Button_Click" /></td>
  ...

这继续增加8个表行，看起来就像第一个一样。 Button_Click执行我已经测试过的操作，一切正常。但我希望按钮网格填充视口的高度，所以当我添加：

   div{ position:fixed;
        position:absolute;
        top:0;
        right:0;
        bottom:0;
        left:0;}

它修复了我的格式，但它使我的所有按钮都不可点击（但它们确实仍然显示）。我环顾四周，但找不到类似的东西;我正在寻找纯HTML或ASP.Net答案，因为此页面用于教学目的。我相信我已将问题缩小到div位置标记，如图中所示，唯一的区别是存在

position:fixed;

Answer 1

由于您定义了要应用于页面中所有div的样式，因此表容器之后的任何其他div将覆盖它并阻止单击。您可以通过设置div的id来确保该样式仅适用于表容器：

<div id='div1'>
    <table>
        <tr>
        ...
        </tr>
    ...
    </table>
</div>

并设置要应用于该特定div的样式：

#div1
{
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

ASP：表格按钮变得无法点击：嵌套在表格内的按钮

1 个答案: