求助：按钮无法随浏览器左右移动仅可上下移动的技术问题

看起来你的按钮定位逻辑出了点小问题，咱们一步步拆解：

问题根源 #

你给按钮设置了position: absolute，同时又指定了left: 725px、right: -420px、width: 40px——这几个属性放在一起会造成浏览器布局计算冲突，而且全是固定像素值，直接把按钮钉死在某个绝对位置上，自然不会随窗口宽度变化而左右移动。另外bottom: -191px这种负数值对当前需求来说完全没必要，反而会干扰定位逻辑。

至于你尝试调整padding和margin没用，是因为绝对定位元素的位置由top/left/right/bottom决定，内边距和外边距只会改变元素自身的大小或内部间距，没法打破固定像素定位的限制。

解决方案 #

根据你的需求，这里提供两种常用的调整方式：

1. 让按钮水平居中，随窗口缩放保持居中

去掉多余的right、bottom属性，用left: 50%配合transform: translateX(-50%)实现自适应居中，这样窗口宽度变化时，按钮会自动左右移动保持居中：

.button {
  position: absolute;
  height: 25px;
  width: 40px;
  top: 290px; /* 保留你需要的垂直位置 */
  left: 50%;
  transform: translateX(-50%);
}

2. 让按钮保持与窗口边缘的固定距离

如果你想让按钮始终距离左边/右边一定距离（比如距离右侧20px），只需要设置单边的定位属性即可，去掉固定的left或right数值：

.button {
  position: absolute;
  height: 25px;
  width: 40px;
  top: 290px;
  right: 20px; /* 按钮始终距离右侧20px，窗口变窄时自动左移 */
  /* 或者用 left: 20px; 让按钮距离左侧20px */
}

这两种方式都能让按钮随窗口宽度变化而左右移动，你可以根据实际需求选择~

内容的提问来源于stack exchange，提问作者user9589034