Css 如何阻止React中多列中的元素溢出？

我创建了一个包含两列的表单，如下所示：

学生姓名是必填字段。因此，当需要一个空输入时，它会抛出一个标记为所需的红色文本。问题是，出现这种情况时，标记为

学生姓名：

的字段名会出现在另一列中，如下所示。

这是我同样的css

.formLayout{
  column-count: 2;
  column-gap: 5%;
}

---

是否有办法防止仅使用.css或任何变通方法来实现这一点？

能否设置行的最小高度

如果有机会发出错误消息，则应该有更多的空间

比如：

display: grid;
grid-template: repeat(2, 100px) / 50% 50%;
column-gap: 5%;

---

哦，我的上帝。你刚刚救了我一天。做了一些小的修改，但已经完成了。谢谢