利用弹性布局使两个表单数据并列并自动充满一行

利用弹性布局（如Flexbox或Grid）可以使两个表单数据在页面上并排排列并且自适应屏幕宽度。这里简述一下如何使用Flexbox实现：

1. **HTML结构**:

<div class="container">
  <div class="form-item item1">表单1</div>
  <div class="form-item item2">表单2</div>
</div>

`container`是包含两个表单项的容器，`.form-item`是每个表单元素。

2. **CSS样式**:

.container {
  display: flex; /* 使用Flexbox */
  flex-wrap: wrap; /* 如果内容超出一列，则换行 */
}

.form-item {
  flex: 1; /* 自动调整大小，等分剩余空间 */
  margin-right: 10px; /* 间距调整，可根据需要设置 */
}

这里的`flex: 1`表示等比例分配可用空间，两个`.form-item`会平均占据一行。如果内容较少，它们就会占据整个行；如果内容较多，其中一个会占用更多空间，另一个则相对较小但仍保持在同一行。