将 css 添加到 h3 后，HTML 按钮不起作用

Question

我希望我的 h3 与我的按钮对齐，所以我将其位置设置为绝对位置以及其他一些东西。如果您想查看问题，可以前往这里。我不知道还有什么可以用来描述这个问题。哦，这个节目是童话镇第五季。任何帮助将不胜感激。

Answer 1

在您的 html 代码中尝试这些更改

<form method="get">
  <h3 class="watching_what">
    <button class="change" style="float:left;" type="submit" name="episode_num" value="0">Previous</button>
        You Are Watching Episode 1          
    <button class="change" style="float:right;" type="submit" name="episode_num" value="2">Next</button>
  </h3>
</form>

并在你的CSS代码中删除transform属性

.watching_what 
{
  text-align: center;
  color: 003099;
  position: absolute;
  /* position: element(#target); */
  /* transform: translateY(-100%); */
  left: 0px;
  right: 0px;
  padding-top: 18pt;
  padding-bottom: 18pt;
}

Answer 2

请将位置和 z-index 添加到 css 文件中的 .change 类中。我在浏览器中检查了它的工作情况。

.change{
position: relative;
z-index: 100;
}