如何在div中向左移动项目？

<div class="container">
  <div class="item">项目1</div>
  <div class="item">项目2</div>
  <div class="item">项目3</div>
</div>

.container {
  width: 300px; /* 设置容器宽度 */
  overflow: hidden; /* 隐藏溢出部分 */
}

.item {
  display: inline-block; /* 让项目水平排列 */
  width: 100px; /* 设置项目宽度 */
  height: 100px; /* 设置项目高度 */
}

.item:nth-child(1) {
  transform: translateX(-100px); /* 向左移动100px */
}

.item:nth-child(2) {
  transform: translateX(-200px); /* 向左移动200px */
}