HMLT/CSS:如何将一个表单分成两个部分，以便并排显示？

<div class="form-container">
  <div class="form-half">
    <!-- 第一个表单部分 -->
    <form>
      <!-- 表单元素1 -->
      <label for="input1">输入1：</label>
      <input type="text" id="input1" name="input1">

      <!-- 表单元素2 -->
      <label for="input2">输入2：</label>
      <input type="text" id="input2" name="input2">
      
      <!-- 可以继续添加其他表单元素 -->
      
    </form>
  </div>
  <div class="form-half">
    <!-- 第二个表单部分 -->
    <form>
      <!-- 表单元素3 -->
      <label for="input3">输入3：</label>
      <input type="text" id="input3" name="input3">

      <!-- 表单元素4 -->
      <label for="input4">输入4：</label>
      <input type="text" id="input4" name="input4">
      
      <!-- 可以继续添加其他表单元素 -->
      
    </form>
  </div>
</div>

.form-container {
  display: flex;
}

.form-half {
  flex: 1;
  padding: 10px;
}