logo标签列表

ASP：表格按钮无法点击：嵌套在div内的表格中的按钮不可点击。

htmlcssasp.net
3

所以，我有一个非常简单的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;

enter image description here

enter image description here

代码示例中的 div 后面还有其他元素吗？ - ConnorsFan
你能用另一个浏览器进行测试吗？我没有Edge，所以无法确定它是否有所不同。 - ConnorsFan
我发表了一个回答来解决在HTML输出中有另一个div的问题。 - ConnorsFan
我稍微找了一下，发现设置z-index可以解决我的问题，谢谢你，否则我永远不会想到去寻找重叠的div标签。 - Jody Sowald
z-index是一种方法。另一种方法是确保div不重叠。 - ConnorsFan
显示剩余7条评论
1个回答
1

由于您定义了适用于页面上所有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;
}
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接