Html “有文字的”；“溢出”；div边界的定义

我正在使自己成为一个图书馆，以帮助我更快地制作注册表格。我一直使用的格式是左侧的一些表单字段（在50%宽的div单元格中），如果我有任何帮助文本，则在右侧的帮助文本（在50%宽的div单元格中）。这是一次完成一个“表单行”，所以我无法将两个表单字段放入done div单元格，以使事情很好地对齐。视觉辅助图像：

我想弄清楚，如果右边的帮助文本较长，我怎么能将其“溢出”到下一个“表单行”，这样我就可以使所有内容保持良好的格式

<div id='form_container'>

    <div id='left_form_container'>
        Form field here as needed       
    </div>

    <div id='right_form_container'> 
        Help text if any
    </div>

</div>

---

谢谢

您可以创建一个对话框，然后确保帮助文本和输入字段共享同一行。或者使用将单个容器拆分为多个div，并附带帮助文本容器，如果没有帮助，这些帮助文本容器将留空

你的视觉辅助有点不清楚，因为它看起来和你想要的完全一样？如果您只是想在右侧有更多的空间容纳内容，为什么不使用一个未格式化为行的容器呢？我希望帮助文本正好位于与之相关的表单字段旁边。假设在学校名称上方有“名字”和“姓氏”字段。如果我只制作左右两个容器（没有行格式），那么“学校名称”将位于“名字”字段旁边。您可以创建一个[CSS网格模板]（）然后确保您的帮助文本和输入字段共享同一行。或者使用将单个容器拆分为多个div，并在没有帮助的情况下与保留为空的帮助文本容器一起使用。我认为这有点宽泛，有很多方法可以做到这一点。指定任何限制？哦，这太棒了。我花了一些时间包装我的h仔细阅读，但它做了我需要的，然后做了一些。我需要开始更经常地了解“新”的东西。非常感谢。很高兴这有帮助，转化为一个答案，请随时提出任何你想要澄清或示例的建议。

#form_container {
    overflow:hidden;
    margin-top:10px;
    }

#left_form_container {
    width:48%;
    float:left;
    padding-right:15px;
    overflow:hidden;
    }

#right_form_container {
    width:48%;
    float:left;
    padding-left:15px;
    overflow:hidden;
    }