无法让第二个向下滚动箭头停留在我想要的位置答案

【问题标题】：Can't get second scroll down arrow to stay where I want it无法让第二个向下滚动箭头停留在我想要的位置
【发布时间】：2021-10-24 03:02:50
【问题描述】：

网站网址：www.awarecanada.com 网站密码是：伍兹

页面上的第一个向下滚动箭头固定在其位置，但“新版本”部分的第二个向下滚动箭头会根据屏幕大小移动（尽管使用相同的编码），为什么会发生这种情况以及我如何获得它停留在图像底部的上方？

【问题讨论】：

嗨，欢迎来到 SO。请先参观。然后阅读how to ask questions here。之后编辑问题以符合指南并提供minimal reproducible example 以获取调试详细信息。带有代码行的图片是不能接受的！！

标签： html css position alignment css-position

【解决方案1】：

尝试将箭头放在它们也需要相对的元素内，而不是放在 BODY 中。到那时，精确对齐它们会容易一千倍！

当前 xpath -> /html/body/div[2]

建议的 xpath -> /html/body/div[2]/main/article/section[2]/div[3]

然后，使用现有的 CSS 进行一些更改

.scroll-down2 {
    position: absolute;
    left: 50%;
    bottom: 20px;
    z-index: 999;
    display: block;
    text-align: center;
    font-size: 20px;
    text-decoration: none;
    width: 13px;
    height: 13px;
    border-bottom: 3px solid white;
    border-right: 3px solid white;
    transform: translate(-50%, 0%) rotate(45deg);
    animation: fade_move_down 4s ease-in-out infinite;
}

调整大小的演示

【讨论】：

嗨，杰克，感谢您的回复！这正是我所追求的，你说的是有道理的，但我在哪里改变路径来纠正这个？你知道 Squarespace 是否允许这样做吗？
我不确定 squarespace，抱歉。尝试编辑该部分以查看是否可以在其中添加自定义 html，箭头只需要在该部分内，而不是只是在正文中浮动，此外，您应该对第一个箭头执行相同的操作。
我不太熟悉 html 和 css，尤其是关于 xpath。我从技术上明白你在说什么，但只是不知道如何实现它，不知道在哪里用你建议的替换 xpath。有没有机会你能告诉我你一步一步做了什么，也许这会有所帮助？非常感谢

【解决方案2】：

因为animation : fade_move_down 4s ease-in-out infinite，您的网站第二个箭头正在移动，只需将其top 属性值更改为1450px 以获取桌面视图

【讨论】：