jquery - 显示区域的 CSS 滚动条

Question

我对 CSS HTML 很陌生。我有一个小问题需要帮助。

我在我的 CSS 中为显示区域定义了以下标记以显示一组问题。我为我的显示区域画了一个静态边框，但有时显示区域内的文本超出高度并流出。我想通过添加一个滚动条来解决这个问题，并为我的显示区域定义一个合适的高度。我可能还不清楚我的问题。所以我插入了一张图片以供引用。

  #disp_desc{
            position: absolute;
            COLOR:cyan;
            font-size:16px;
            font-family: Verdana;
            width: 55%;
            top: 255px;
            left: 215px;
            margin-left: ;
            margin-right: ;
            text-align: left;
            overflow-y: scroll;
   }

<div id="problemform" class="form-inline">
        <textarea id="probleminput" class="form-inline" type="text" style="display: inline;"></textarea>
        <button id="problemsubmit" class="btn" type="submit" style="display: inline-block;">Submit</button>
    </div>

第一次接触是我的展示区。忽略内容和输入框。我只想使用滚动条将整个文本放入定义的边框内。

我还希望只有当文本大小足够大时才显示滚动条。否则，即使是 1-2 行的内容，它也会显示，而滚动条对此没有意义。我可以用 CSS 控制它吗？

Answer 1

您的 #disp_desc 元素没有指定的 height，并且绝对定位它没有任何假设高度。因此，您的元素完全不受高度限制，并且会继续增长。

要解决这个问题，只需给它一个高度:

#disp_desc {
    ...
    height: 100px;
}