滚动到顶部按钮在底部造成了页面多余的空白-PHP中文网问答

我按照一些教程创建了一个基于CSS的浮动滚动到顶部按钮。然而，我注意到最后一个HTML元素（例如最后一行）下面有额外的空白空间。额外的空白空间的高度与我的按钮高度（50px）相匹配。

我还尝试添加一个额外的div标签来封装arrowUp div标签，间隙减小了，但仍然有一些较小但明显的空白空间。

我想知道是否有一种方法可以避免额外的空白空间？

#arrowUp {
  position: sticky;
  width: 50px;
  bottom: 120px;
  background: #699462;
  border-radius: 10px;
  aspect-ratio: 1;
  margin-left: auto;
  margin-right: 20px;
// margin-bottom: 150px;

}

#arrowUp a {
  content: “”;
position: absolute;
  inset: 25%;
  transform: translateY(20%) rotate(-45deg);
  border-top: 5px solid #fff;
  border-right: 5px solid #fff;
}

<div>
<p> 第一行。 </p>
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<br /><br /><br /><br />
<p> 最后一行。 </p>
</div>
<div id="arrowUp">
<a href="#"></a>
</div>