Javascript 儿童潜水器，配备主潜水器高度（并排）

如何使我的

.FormBox\u Main

和

.ResultBox\u Main

动态跟踪

.ResultBox\u Child

可能存在的不确定高度。默认情况下，我将100%的高度设置为

.FormBox\u Main

和

.ResultBox\u Main

，但如果

.ResultBox\u Child

的高度超过了100%，它将与“Main”div匹配

在CSS（避免JavaScript）中可以做些什么，使高度跟随

.ResultBox\u Child

可能具有的任何高度

CSS:

HTML:

一些文本

正文
正文
正文
正文
正文

当前结果：

---

您可以添加一个

溢出：滚动

以防止出现这种情况：

div.ResultBox\u Main{
背景色：#333；
宽度：80%；
高度：100px；
左：20%；
位置：绝对位置；
边框：1px实心#FF0000；
溢出：滚动；
}
div.ResultBox\u子项{
背景色：红色；
边缘顶部：10px；
宽度：98%；
浮动：对；
边框：1px实心#00FF00；
}

主要结果
结果子

正文
正文
正文
正文
正文

框大小：边框框；抱歉，不起作用。设置

页边距顶部：0px不工作，适合。我需要
.FormBox\u Main
和
.ResultBox\u Main
在
.ResultBox\u子项的高度超过100%时跟随它。它可以工作。谢谢是否可以阻止显示默认的滚动条？只有在必要时才出现？是的，或者你可以完全隐藏它们。我让你查一下：-）
div.FormBox_Main{
    background-color: #F1F1F1;
    width: 20%;
    height: 100%;
    left: 0;
    position: absolute;
    border: 1px solid #0000FF;
}

div.FormBox_Child{
    background-color: transparent;
    width: 95%;
    margin-top: 10px;
    float: right;
    border: 0px solid #00FF00;
}

div.ResultBox_Main{
    background-color: #FFFFFF;
    width: 80%;
    height: 100%;
    left: 20%;
    position: absolute;
    border: 1px solid #FF0000;
}

div.ResultBox_Child{
    background-color: transparent;
    margin-top: 10px;
    width: 98%;
    float: right;
    border: 1px solid #00FF00;
}

<div class="FormBox_Main">
    <div class="FormBox_Child">
        <label for="SomeText">Some Text</label>
        <input type="text" name="SomeText">
        <input type="submit" name="Submit" value="Submit">
    </div>
</div>


<div class="ResultBox_Main">
    <div class="ResultBox_Child">
        <ul>
            <li>Text</li>
            <li>Text</li>
            <li>Text</li>
            <li>Text</li>
            <li>Text</li>
            <!-- ++ Multiple Lines -->
        </ul>
    </div>
</div>