按钮的可点击区域在按钮上方答案

【问题标题】：Button's clickable area is above the button按钮的可点击区域在按钮上方
【发布时间】：2022-02-08 12:37:12
【问题描述】：

我对 HTML 比较陌生，在使用 display: flex 后遇到了这个错误。我的按钮可点击区域在实际按钮上方约 10px 处，当我使用检查元素时，按钮高亮显示其在可见按钮的上方。

<body>
    <h1 id="HomepageTitle" style="display: flex; justify-content: center; font-family: sans-serif; color: black;">CoderTom</h1>
    <h2 id="HomepageHeader" style="display: flex; justify-content: center; font-family: sans-serif; color: blue;">Home</h3>

    <div class="button-group" style="display: flex; justify-content: center;">
        <a href="contactpage.html"><button style="position : relative; top: 50px; background-color: rgb(0, 255, 55); font-family: sans-serif; font-weight: 700; color: black; width: 100%; height: 100%;">Contact</button></a>
    </div>
    <script src="application.js"></script>
</body>

【问题讨论】：

你能把它贴在密码箱里吗？另外请附上你得到的图片。

标签： javascript html web

【解决方案1】：

属性顶部：锚标记中的 50px 将元素向上移动 50px。我猜你想把它交给父母（.button-group）

【讨论】：

【解决方案2】：

我建议您将标签设置为按钮样式并添加“显示：块” 还记得重置浏览器的默认样式

【讨论】：

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。