vue让提交按钮始终在最下方居中位置，不要被覆盖

可以使用Flex布局实现提交按钮始终在最下方居中位置。具体做法如下：

HTML代码：

<div class="container">
  <div class="content">Content</div>
  <div class="submit">
    <button>Submit</button>
  </div>
</div>

CSS代码：

.container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  height: 100vh;
}

.content {
  background-color: #f0f0f0;
  width: 200px;
  height: 200px;
}

.submit {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  height: 80px;
}

button {
  background-color: #d0d0d0;
  width: 100px;
  height: 40px;
  border: none;
  border-radius: 5px;
}

其中，`display: flex`表示使用Flex布局，`flex-direction: column`表示主轴方向为纵向，`justify-content: space-between`表示在主轴方向上两端对齐，中间留有空白，`align-items: center`表示在交叉轴方向上居中对齐。`height: 100vh`表示容器高度为视口高度。`.submit`元素使用了Flex布局，并设置了`align-items: flex-end`，使得提交按钮始终在最下方居中位置。同时，为了避免被内容区域覆盖，需要设置`.submit`元素的高度，这里设置为80px。`button`元素设置了一些基本样式，可以根据实际需求进行调整。