Iss*_*nzi 8 html javascript css htmlbutton
我正在尝试构建一个Web应用程序，但是遇到了问题。
该应用程序的大多数界面都由许多按钮组成，我遇到了一个奇怪的现象，即无法单击某些按钮（没有单击动画，并且onclick（）无法运行）。
我注意到，在多个按钮彼此叠放的情况下，仅最后一行按钮是可单击的。
我创建了一个最小，完整和可验证的示例。
<html>
<body>
<div style="padding-top: 20%;" id="div1">
<button>
Button 1
</button><br />
<button>
Button 2
</button>
</div>
<script>
document.getElementById("div1").style.display = "initial";
</script>
</body>
</html>进一步的意见/说明：
当您从开发人员菜单中选择一个元素时，您将无法选择发生故障的按钮。
我正在使用Firefox。我在Chrome中的应用程序遇到了类似的问题，但是行为不当的按钮与Firefox中损坏的按钮不同。
我试图<div>通过分别设置display: none;和隐藏和显示各种元素（不同的屏幕）来创建单页Web应用程序display: initial;。这就是原因<script>。我应该有更好的方法吗？
display: initial;相当于display: inline;您的情况。
将padding-top然后被施加到的内容的每个线，使得该第二线罩的第一行。更容易查看是否将背景添加到包含的div。
#div1 {
padding-top: 15px;
display: initial;
background: #f00;
}<div id="div1">
<button>
Button 1
</button>
<br>
<button>
Button 2
</button>
</div>