怎样才能让所有的按钮在颤动时都挤到左边？

<button id="button1">按钮1</button>
<button id="button2">按钮2</button>
<button id="button3">按钮3</button>

button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* 其他按钮样式设置 */
}

@keyframes shake {
  0% { transform: translateX(0); }
  25% { transform: translateX(-10px); }
  50% { transform: translateX(0); }
  75% { transform: translateX(-10px); }
  100% { transform: translateX(0); }
}

var buttons = document.querySelectorAll("button");

buttons.forEach(function(button) {
  button.addEventListener("mouseover", function() {
    button.style.animation = "shake 0.5s infinite";
    button.style.left = "10px"; // 挤到左边的位置
  });

  button.addEventListener("mouseout", function() {
    button.style.animation = "";
    button.style.left = "50%"; // 恢复原始位置
  });
});