布局中的按钮间距相等，但有一个空的插槽

<div class="button-container">
  <button>按钮1</button>
  <button>按钮2</button>
  <div class="empty-slot"></div>
  <button>按钮3</button>
  <button>按钮4</button>
</div>

.button-container {
  display: flex;
  justify-content: space-between;
}

.empty-slot {
  width: 100px; /* 设置空插槽的宽度 */
}

<div class="button-container">
  <button>按钮1</button>
  <button>按钮2</button>
  <div class="empty-slot"></div>
  <button>按钮3</button>
  <button>按钮4</button>
</div>

.button-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 设置按钮列的宽度，这里假设有4个按钮 */
}

.empty-slot {
  grid-column: 3; /* 设置空插槽所在的列 */
}