固定按钮在我滚动时移动答案

【问题标题】：Fixed button moving if i scroll固定按钮在我滚动时移动
【发布时间】：2020-07-28 14:51:03
【问题描述】：

我的页面右下角有一个 Whatsapp 链接按钮，当我更改页面时，它会停留在应有的位置，但如果我向下滚动并更改页面，它会移动到页面顶部。我不知道为什么会这样。

这是我的 CSS 代码：

    .floating {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 40px;
  background-color: #25d366;
  color: #fff;
  border-radius: 50px;
  text-align: center;
  font-size: 30px;
  box-shadow: 2px 2px 3px #999;
  z-index: 100000;
  right: 15px;
}

.my-float {
  margin-top: 16px;
}

.whatsapp-container {
  position: sticky;
 
}

还有 jsx：

<div className="whatsapp-container">
  <a
    href=""
    className="link-simulator floating"
    target="_blank"
  >
    <i className="fab fa-whatsapp my-float"></i>
  </a>
</div>

谁能帮我解决这个问题？

【问题讨论】：

标签： css button jsx sticky

【解决方案1】：

我无法从您发布的代码中重现该问题，但它可能与 whatsapp-container 的 position:sticky 相关，您是否尝试将其删除？

【讨论】：

是的，实际上我补充说，因为我虽然它会解决问题。停留在右下角，但是当我滚动和更改页面时，它会移动到页面顶部，然后返回右下角位置

【解决方案2】：

所以，显然，我所做的并没有什么问题，我只是先从反应渲染中获得了另一个 posed-element 并且没有让这个渲染，所以定位的东西不起作用

【讨论】：